5 <script type="text/javascript">
\r
6 window.onload = function () {
\r
7 var chart = new CanvasJS.Chart("chartContainer",
\r
10 text: "Temperature Comparison of Two Cities",
\r
12 exportEnabled: true,
\r
19 intervalType: "month",
\r
20 valueFormatString: "MMM",
\r
27 type: "rangeColumn",
\r
29 indexLabel: "{y[#index]}",
\r
30 indexLabelFontSize: 12,
\r
31 yValueFormatString: "#0.## °C",
\r
34 {x: new Date(2013,00,01), y: [08, 20]},
\r
35 {x: new Date(2013,01,01), y: [10, 24]},
\r
36 {x: new Date(2013,02,01), y: [16, 29]},
\r
37 {x: new Date(2013,03,01), y: [21, 36]},
\r
38 {x: new Date(2013,04,01), y: [26, 39]},
\r
39 {x: new Date(2013,05,01), y: [22, 39]},
\r
40 {x: new Date(2013,06,01), y: [20, 35]},
\r
41 {x: new Date(2013,07,01), y: [20, 34]},
\r
42 {x: new Date(2013,08,01), y: [20, 34]},
\r
43 {x: new Date(2013,09,01), y: [19, 33]},
\r
44 {x: new Date(2013,10,01), y: [13, 28]},
\r
45 {x: new Date(2013,11,01), y: [09, 23]}
\r
49 type: "rangeColumn",
\r
52 indexLabel: "{y[#index]}",
\r
53 indexLabelFontSize: 12,
\r
54 yValueFormatString: "#0.## °C",
\r
56 {x: new Date(2013,00,01), y: [16, 28]},
\r
57 {x: new Date(2013,01,01), y: [18, 31]},
\r
58 {x: new Date(2013,02,01), y: [20, 33]},
\r
59 {x: new Date(2013,03,01), y: [22, 34]},
\r
60 {x: new Date(2013,04,01), y: [22, 33]},
\r
61 {x: new Date(2013,05,01), y: [20, 29]},
\r
62 {x: new Date(2013,06,01), y: [20, 28]},
\r
63 {x: new Date(2013,07,01), y: [20, 28]},
\r
64 {x: new Date(2013,08,01), y: [20, 28]},
\r
65 {x: new Date(2013,09,01), y: [20, 28]},
\r
66 {x: new Date(2013,10,01), y: [14, 27]},
\r
67 {x: new Date(2013,11,01), y: [11, 26]}
\r
75 <script src="../../canvasjs.min.js"></script>
\r
76 <title>CanvasJS Example</title>
\r
79 <div id="chartContainer" style="height: 400px; width: 100%;"></div>
\r