1.js脚本:
- 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");- makeCharts=function(){
- varchart1=newdojox.charting.Chart2D("simplechart");
- /*type:
- *Lines,Markers,Areas,MarkersOnly
- */
- //chart1.addPlot("default",{type:"Lines"});
- //chart1.addPlot("default",{type:"StackedAreas",lines:true,areas:true,markers:false});
- chart1.addPlot("default",{type:"Lines",markers:true,tension:"X",shadows:{dx:2,dy:2}});
- chart1.addPlot("other",{type:"Areas"});
- chart1.addPlot("Grid",{type:"Grid",
- hAxis:"otherx",
- vAxis:"othery",
- hMajorLines:true,
- hMinorLines:false,
- vMajorLines:true,
- vMinorLines:false
- });
- //chart1.addAxis("x");
- chart1.addAxis("x",{
- labels:[
- {value:1,text:"Jan"},{value:2,text:"Feb"},
- {value:3,text:"Mar"},{value:4,text:"Apr"},
- {value:5,text:"May"},{value:6,text:"Jun"},
- {value:7,text:"Jul"},{value:8,text:"Aug"},
- {value:9,text:"Sep"},{value:10,text:"Oct"},
- {value:11,text:"Nov"},{value:12,text:"Dec"}
- ]
- });
- chart1.addAxis("y",{vertical:true});
- chart1.addSeries("Series1",[0,1.5,2,3,4,5,7]);
- chart1.addSeries("Series2",[4,1,6,3],{plot:"other",stroke:{color:"green"},fill:"lightblue"});
- chart1.addSeries("SeriesA",[{x:1,y:5},{x:1.5,y:1.7},{x:2,y:9},{x:5,y:3}],{stroke:{color:"red"}});
- chart1.render();
- };
- dojo.addOnLoad(makeCharts);
2.HTML代码:
- <divid="simplechart"style="width:600px;height:400px;"></div>