Basic Column Chart - CanvasJS JavaScript Charts

Basic Column Chart - CanvasJS JavaScript Charts

by daniel silva

HTML

<script src="http://canvasjs.com/assets/script/canvasjs.min.js"></script>
<br/>
<!-- Just so that JSFiddle's Result label doesn't overlap the Chart -->
<div id="chartContainer" style="height: 360px; width: 100%;"></div>

JavaScript

var chart = new CanvasJS.Chart("chartContainer", {
  "axisX": {
    "valueFormatString": "YYYY-MM-DD",
  },
  "axisY": {

  },

  "data": [{
    "type": "stackedArea",
    "xValueType": "dateTime",
    "name": "bbb",
    "dataPoints": [{
      "x": 1488805200000,
      "y": 10
    }, {
      "x": 1488808800000,
      "y": 20
    }, {
      "x": 1488812400000,
      "y": 10
    }],
    "xValueFormatString": "YYYY-MM-DD"
  }, {
    "type": "stackedArea",
    "xValueType": "dateTime",
    "name": "aaa",
    "dataPoints": [{
      "x": 1488801600000,
      "y": 5
    }, {
      "x": 1488805200000,
      "y": 21
    }, {
      "x": 1488808800000,
      "y": 10
    }, {
      "x": 1488812400000,
      "y": 0
    }],

  }]
});

chart.render();