charts/canvas/examples/16-step-area-chart/basic-step-area-chart.html

   1 <!DOCTYPE HTML>\r
   2 <html>\r
   3 <head>\r
   4         <script type="text/javascript">\r
   5                 window.onload = function () {\r
   6                         var chart = new CanvasJS.Chart("chartContainer", {\r
   7                                 title: {\r
   8                                         text: "Basic Step Line Chart"\r
   9                                 },\r
  10                                 axisY: {\r
  11                                         includeZero: false,\r
  12                                 },\r
  13 \r
  14                                 data: [\r
  15                                 {\r
  16                                         type: "stepArea",\r
  17                                         dataPoints: [                                   \r
  18                                         { x: new Date(2012, 1), y: 8.3 },\r
  19                                         { x: new Date(2012, 2), y: 8.2 },\r
  20                                         { x: new Date(2012, 3), y: 8.1 },\r
  21                                         { x: new Date(2012, 4), y: 8.2 },\r
  22                                         { x: new Date(2012, 5), y: 8.2 },\r
  23                                         { x: new Date(2012, 6), y: 8.2 },\r
  24                                         { x: new Date(2012, 7), y: 8.1 },\r
  25                                         { x: new Date(2012, 8), y: 7.8 },\r
  26                                         { x: new Date(2012, 9), y: 7.9 },\r
  27                                         { x: new Date(2012, 10), y: 7.8 },\r
  28                                         { x: new Date(2012, 11), y: 7.8 },\r
  29                                         { x: new Date(2013, 0), y: 7.9 },\r
  30                                         { x: new Date(2013, 1), y: 7.7 },\r
  31                                         { x: new Date(2013, 2), y: 7.6 },\r
  32                                         { x: new Date(2013, 3), y: 7.5 }\r
  33                                         ]\r
  34                                 }\r
  35 \r
  36                                 ]\r
  37                         });\r
  38                         chart.render();\r
  39                 }\r
  40         </script>\r
  41         <script src="../../canvasjs.min.js"></script>\r
  42         <title>CanvasJS Example</title>\r
  43 </head>\r
  44 \r
  45 <body>\r
  46         <div id="chartContainer" style="height: 400px; width: 100%;"></div>\r
  47 </body>\r
  48 \r
  49 </html>