dojo.Chart2D----Pie chart
本机运行环境描述：
WinXP sp3
apache2.2
FF3.6 IE8
dojo Kernel 1.4.2
dojo1.4.3以后，所有组建均带有test包，所以可以直接运行例子进行查看。但是1.4.2版本没有官方的test，经过项目的研究以及各方资料，现在总结。代码如下
导入的包：
<mce:script src="../../../dojoroot/dojo/dojo.js" mce_src="dojoroot/dojo/dojo.js" djConfig="isDebug: false, parseOnLoad: true"></mce:script> <script> dojo.require("dojox.charting.Chart2D"); dojo.require("dojox.charting.plot2d.Pie"); dojo.require("dojox.charting.action2d.Highlight"); dojo.require("dojox.charting.action2d.MoveSlice"); dojo.require("dojox.charting.action2d.Tooltip"); dojo.require("dojox.charting.themes.MiamiNice"); dojo.require("dojox.charting.widget.Legend"); dojo.require("dojo.data.ItemFileWriteStore"); dojo.require("dijit.form.NumberSpinner"); dojo.require("dojox.charting.themes.PlotKit.blue");
Javascript
dojo.xhr('POST',{ url:'ips_main.php', sync:true, handleAs :'json', content:{ test:123 }, load:function(response){ store = new dojo.data.ItemFileReadStore({data:response}); store = response.items; }, error:function(error){ } }); var dc = dojox.charting; var chartOne = new dc.Chart2D("pie"); chartOne.setTheme(dc.themes.MiamiNice).addPlot("default", { type: "Pie", font: "normal normal 11pt Tahoma", fontColor: "black", labelOffset: -30, radius: 100 }).addSeries("Series A", store); var anim_a = new dc.action2d.MoveSlice(chartOne, "default"); var anim_b = new dc.action2d.Highlight(chartOne, "default"); var anim_c = new dc.action2d.Tooltip(chartOne, "default"); chartOne.render(); var legendTwo = new dojox.charting.widget.Legend({ chart: chartOne }, "pie_legend");
HTML代码：
<body class="tundra"> <div id="charts"> <div class="chart-area"> <div id="pie_legend"></div> <div id="pie" class="chart"></div> </div> </div> </body>
javascript代码中，第一段的dojo的xhr请求向后台要求数据，数据格式如下：
{'identifier':'id','idAttribute':'id','label':'id','items':[{'id':'total','sennum':1,'sentotal':1,'uniquealert':7,'classnum':4,'totalnumalert':15471,'sourceipcnt':8,'destipcnt':3,'uniqueiplink':9,'sourceportscnt':261,'destportscnt':4,'tcpsourceportcnt':261,'tcpdestportcnt':4,'udpsourceportcnt':0,'udpdestportcnt':0}]}
得到以后，手动的设置chart的store组件，以便于进行图片展示。
这里不多说了，查看附件
http://download.csdn.net/source/3005366