<html >
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″>
<title>Untitled 1</title>
<script type=”text/javascript” src= “../js/dojo/dojo/dojo.js” djConfig=”isDebug: true”></script>
<script type=”text/javascript”>
dojo.require(“dojox.charting.Chart2D”);
makeCharts = function(){
var chart1 = new dojox.charting.Chart2D(“simplechart”);
chart1.addPlot(“default”, {type: “Lines”});
chart1.addPlot(“other”, {type: “Areas”, hAxis: “other x”, vAxis: “other y”});
chart1.addPlot(“Grid”, {type: “Grid”, hAxis: “other x”, vAxis: “other y”,hMajorLines: true, hMinorLines: false, vMajorLines: true, vMinorLines: false});
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.addAxis(“other x”, {leftBottom: false});
chart1.addAxis(“other y”, {vertical: true,
leftBottom: false,
max: 7,
stroke: “green”,
font: “normal normal bold 14pt Tahoma”,
fontColor: “red”,
majorTick: {color: “red”, length: 6},
minorTick: {stroke: “black”, length: 3}
});
chart1.addSeries(“Series 1”, [1, 2, 4, 5, 5, 7], {stroke: {color: “blue”, width: 2},
fill: “lightblue”});
chart1.addSeries(“Series 2”, [1, 1, 4, 2, 1, 6, 4, 3],
{plot: “other”, stroke: {color:”blue”}, fill: “lightblue”}
);
chart1.render();
};
dojo.addOnLoad(makeCharts);
</script>
</head>
<body>
<div id=”simplechart” style=”width: 250px; height: 150px;”></div>
</body>
</html>
Output:
Filed under: Dojo | 1 Comment »