Basic Column Chart - CanvasJS JavaScript Charts

Basic Column Chart - CanvasJS JavaScript Charts

by lokey1410

HTML

<script src="https://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", {
  data: [
    {
      type: "spline",
      
      dataPoints:[
	{"x" : 5, "y" : 100.5},
	{"x" : 5.5, "y" : 103.2},
	{"x" : 6, "y" :106.0},
	{"x" : 6.5, "y" : 108.7},
	{"x" : 7, "y" : 111.4},
	{"x" : 7.5, "y" : 114.1},
	{"x" : 8, "y" : 116.8},
	{"x" : 8.5,"y" : 119.6},
	{"x" : 9, "y" : 122.4},
	{"x" : 9.5, "y" : 125.2},
	{"x" : 10, "y" :128.1},
	{"x" : 10.5, "y" : 130.9},
	{"x" : 11, "y" : 133.7},
	{"x" : 11.5, "y" : 136.4},
	{"x" : 12, "y" : 138.9},
	{"x" : 12.5, "y" : 141.1},
	
	{"x" : 13, "y" : 142.9},
	{"x" : 13.5, "y" : 144.5},
	{"x" : 14, "y" : 145.8},
	{"x" : 14.5, "y" : 146.8},
	{"x" : 15, "y" : 147.5},
	
	{"x" : 15.5, "y" : 148.1},
	{"x" : 16, "y" : 148.6},
	{"x" : 16.5, "y" : 149.1},
	{"x" : 17, "y" : 149.5},

	{"x" : 17.5, "y" : 149.8},
	{"x" : 18, "y" : 150.2}
 ]
  }					
  ]
});

chart.render();