Basic Column Chart - CanvasJS JavaScript Charts
Basic Column Chart - CanvasJS JavaScript Charts
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", {
height: 600,
zoomEnabled: true,
title: {
text: "lol ".concat("lol").concat(" Chart"),
fontSize: 15
},
axisX: {
title: "Time",
titleFontSize: 15,
includeZero: false,
valueFormatString: "HH:mm:ss.fff",
labelFontSize: 15,
labelAngle: -50
},
axisY: {
interlacedColor: "#F0F8FF",
title: "Price",
titleFontSize: 15,
valueFormatString: "0.000000",
labelFontSize: 15,
includeZero: false
},
legend: {
cursor: "pointer",
itemclick: function(e) {
if (typeof(e.dataSeries.visible) === "undefined" || e.dataSeries.visible) {
e.dataSeries.visible = false;
} else {
e.dataSeries.visible = true;
}
e.chart.render();
},
fontSize: 15
},
data: [
{
"showInLegend": true,
"legendText": "Child Order xxx (xxx)",
"xValueFormatString": "HH:mm:ss.fff",
"markerSize": 12,
"type": "line",
"lineThickness": 2,
"toolTipContent": "Average Filled ",
"dataPoints": [
...