Timestamp with viewportMinimum set to 1 month less than last DataPoint- CanvasJS JavaScript Charts
Timestamp with viewportMinimum set to 1 month less than last DataPoint- CanvasJS JavaScript Charts
by canvasjs
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", {
zoomEnabled: true,
data: [{
type: "line",
dataPoints: [
{ x: new Date(2012, 01, 1), y: 40},
{ x: new Date(2012, 01, 3), y: 38},
{ x: new Date(2012, 01, 5), y: 43},
{ x: new Date(2012, 01, 7), y: 40},
{ x: new Date(2012, 01, 12), y: 38},
{ x: new Date(2012, 01, 15), y: 43},
{ x: new Date(2012, 01, 18), y: 40},
{ x: new Date(2012, 01, 21), y: 38},
{ x: new Date(2012, 01, 25), y: 43},
{ x: new Date(2012, 02, 1), y: 40},
{ x: new Date(2012, 02, 3), y: 38},
{ x: new Date(2012, 02, 5), y: 43},
{ x: new Date(2012, 02, 7), y: 40},
{ x: new Date(2012, 02, 12), y: 38},
{ x: new Date(2012, 02, 15), y: 43},
{ x: new Date(2012, 02, 18), y: 40},
{ x: new Date(2012, 02, 21), y: 38},
{ x: new Date(2012, 02, 25), y: 43},
{ x: new Date(2012, 03, 1), y: 40},
{ x: new Date(2012, 03, 3), y: 38},
{ x: new Date(2012, 03, 5), y: 43},
{ x: new Date(2012, 03, 7), y: 40},
{ x: new Date(2012, 03, 12), y: 38},
{ x: new Date(2012, 03, 15), y: 43},
{ x: new Date(2012, 03, 18), y: 40},
{ x: new Date(2012, 03, 21), y: 38},
{ x: new Date(2012, 03, 25), y: 43},
]
}]
});
if(!chart.options.axisX)
chart.options.axisX = {};
var dpsLength = chart.options.data[0].dataPoints.length;
var lastDate = chart.options.data[0].dataPoints[dpsLength-1].x;
chart.options.axisX.viewportMinimum = new Date(lastDate.getFullYear(),lastDate.getMonth()-1,lastDate.getDate());
chart.render();