rangeChanged not firing rangeChanging
If you move the navigator slider you will see in the error console that the only event.type that ever fires is "rangeChanged" and never any "rangeChanging" as described in the documentation: https://canvasjs.com/docs/stockcharts/stockchart-options/range-changed/. Furthermore, it appears that "rangeChanged" is firing continuously as the slider is being moved. I would expect the "rangeChanging" would fire "onmousemove" and "rangeChanged" would fire on "onmouseup" so that we could avoid doing excessive updates on our side.
by jcmalek
HTML
<script src="https://canvasjs.com/assets/script/canvasjs.stock.min.js"></script>
<br/><!-- Just so that JSFiddle's Result label doesn't overlap the StockChart -->
<div id="stockChartContainer" style="height: 450px; width: 100%;"></div>
JavaScript
var dataPoints = [
{ x: new Date(2018, 0, 0), y: 71 },
{ x: new Date(2018, 01, 0), y: 55 },
{ x: new Date(2018, 02, 0), y: 50 },
{ x: new Date(2018, 03, 0), y: 65 },
{ x: new Date(2018, 04, 0), y: 95 },
{ x: new Date(2018, 05, 0), y: 68 },
{ x: new Date(2018, 06, 0), y: 28 },
{ x: new Date(2018, 07, 0), y: 34 },
{ x: new Date(2018, 08, 0), y: 14 },
{ x: new Date(2018, 09, 0), y: 71 },
{ x: new Date(2018, 10, 0), y: 55 },
{ x: new Date(2018, 11, 0), y: 50 },
{ x: new Date(2019, 0, 0), y: 71 },
{ x: new Date(2019, 01, 0), y: 55 },
{ x: new Date(2019, 02, 0), y: 50 },
{ x: new Date(2019, 03, 0), y: 65 },
{ x: new Date(2019, 04, 0), y: 95 },
{ x: new Date(2019, 05, 0), y: 68 },
{ x: new Date(2019, 06, 0), y: 28 },
{ x: new Date(2019, 07, 0), y: 34 },
{ x: new Date(2019, 08, 0), y: 14 },
{ x: new Date(2019, 09, 0), y: 71 },
{ x: new Date(2019, 10, 0), y: 55 },
{ x: new Date(2019, 11, 0), y: 50 }
];
var stockChart = new CanvasJS.StockChart("stockChartContainer", {
rangeChanged: (event) => {
console.error(event.type);
},
title:{
text: "Basic StockChart"
},
exportEnabled: true,
charts: [{
data: [{
type: "line",
dataPoints: dataPoints
}]
}],
navigator: {
slider: {
minimum: new Date(2018, 07, 00),
maximum: new Date(2019, 07, 00)
}
}
});
stockChart.render();