这是我找到的一个饼图的页面,我想模仿她,但是我的页面不报错,也不显示饼图,我的页面代码在最下面,我是把数据放在dropdownlist里,然后用javascript去读,但是好像有问题,望有人能帮忙,也欢迎推荐简单的第三方控件或组件
<meta http-equiv="Content-Language" content="ja" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<title>円グラフ サンプル - jsライブラリ - HTML5.JP</title>
<style type="text/css">
canvas {border:1px solid #4c4c4c;}
</style>
<!--[if IE]><script type="text/javascript" src="../html5jp/excanvas/excanvas.js"></script><![endif]-->
<script type="text/javascript" src="../html5jp/graph/circle.js"></script>
<script type="text/javascript">
window.onload = function() {
var cg = new html5jp.graph.circle("sample");
if( ! cg ) { return; }
var items = [
["sample01", 150],
["sample02", 100],
["sample03", 80],
["sample04", 60],
["sample05", 30],
["sample06", 20],
["sample07", 10],
["sample08", 10],
["sample09", 10],
["sample10", 10],
["sample11", 10],
["sample12", 10]
];
cg.draw(items);
};
</script>
</head>
<body>
<h1>円グラフ サンプル - jsライブラリ - HTML5.JP</h1>
<div><canvas width="400" height="300" id="sample"></canvas></div>
</body>
</html>
我的代码:<%@Import Namespace="System.Data"%>
<%@Import Namespace="System.Data.Sqlclient"%>
<script runat="server" language="vb">
Sub page_load()
if not ispostback then
Dim con as sqlconnection
Dim strcmd as string
Dim cmd as sqlcommand
con = New SqlConnection(ConfigurationSettings.AppSettings("angxu"))
strcmd="select top 8 count(*) as ct,jzdt from resume group by jzdt order by ct desc"
cmd=new sqlcommand(strcmd,con)
con.open()
ar.datasource=cmd.executereader()
ar.datatextfield="jzdt"
ar.datavaluefield="ct"
ar.databind()
con.close()
end ifEnd sub
</script>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
canvas {border:1px solid #4c4c4c;}
</style>
</head>
<body>
<form runat="server"><asp:dropdownlist id="ar" runat="server"/>
</form>
<script type="text/javascript" src="js/circle.js"></script>
<script type="text/javascript">
window.onload = function() {
var items=new Array();
var cg = new html5jp.graph.circle("sample");
for (var counter=0;counter<document.getElementById("ar").options.lenght;counter++){
items[counter] = ['document.getElementById("ar").options[counter].text', document.getElementById("ar").options[counter].value];
}
cg.draw(items);
};
</script>
</head>
<body><div><canvas width="400" height="300" id="sample"></canvas></div>
</body>
</html>

解决方案 »

  1.   

    使用Infragistics控件吧,网上免费的大把,一个DataSet带进去不管是饼还是面条,统统搞定
      

  2.   

    http://www.cnblogs.com/xiongeee/archive/2008/03/21/671523.html
      

  3.   

    http://download.csdn.net/source/449360
      

  4.   

    我建议你使用ZedGraph,它是开源控件共享源代码,而且非常容易上手,在官网有很多sample可以用,当然有饼图http://zedgraph.org/wiki/index.php?title=Sample_Graphs, 上去看看吧