JavaScript
var chart = new CanvasJS.Chart("chartContainer",
{
axisY: {
includeZero: false,
interval: 60 *1000, //Here interval is set to minute
labelFormatter: function (e) {
return CanvasJS.formatDate( e.value, "hh:mm:ss"); //For showing dateTime format in Y axis
}
},
toolTip:{
shared: true,
contentFormatter: function (e) {
var content = "";
content += e.entries[0].dataPoint.x + "<br/>"
for(var i=0; i<e.entries.length; i++) {
content += "<span style= \"color:"+e.entries[i].dataSeries.color + "\">" + e.entries[i].dataSeries.name + "</span>: " + CanvasJS.formatDate(e.entries[i].dataPoint.y,"hh:mm:ss TT") + " <br/>"; //Formatting dateTime in ToolTip
}
return content;
}
},
data: [
{
type: "column",
dataPoints: [
{ x: 10, y: new Date(2016, 1, 15, 8, 16, 15)},
{ x: 20, y: new Date(2016, 1, 15, 8, 16, 35)},
{ x: 30, y: new Date(2016, 1, 15, 8, 16, 05)},
{ x: 40, y: new Date(2016, 1, 15, 8, 15, 15)},
{ x: 50, y: new Date(2016, 1, 15, 8, 17, 15)},
{ x: 60, y: new Date(2016, 1, 15, 8, 16, 50)},
{ x: 70, y: new Date(2016, 1, 15, 8, 18, 15)},
{ x: 80, y: new Date(2016, 1, 15, 8, 16, 15)},
{ x: 90, y: new Date(2016, 1, 15, 8, 14, 15)}
]
},
{
type: "column",
dataPoints: [
{ x: 10, y: new Date(2016, 1, 15, 8, 16, 25)},
{ x: 20, y: new Date(2016, 1, 15, 8, 16, 15)},
{ x: 30, y: new Date(2016, 1, 15, 8, 16, 35)},
{ x: 40, y: new Date(2016, 1, 15, 8, 15, 45)},
{ x: 50, y: new Date(2016, 1, 15, 8, 17, 25)},
{ x: 60, y: new Date(2016, 1, 15, 8, 16, 30)},
{ x: 70, y: new Date(2016, 1, 15, 8, 18, 55)},
{ x: 80, y: new Date(2016, 1, 15, 8, 16, 15)},
{ x: 90, y: new Date(2016, 1, 15, 8, 14, 35)}
...