Hello,
I have a dynamic chart that updates every 100 ms. I know my values will range from 0 to 100, but the chart keeps readjusting its Y-axis range. How can I set a fixed Y-axis range from 0 to 100 to ensure everything is displayed proportionally?
function scoreGraphSetup() {
// Global vars used:
// scoreBuffer, latestScore
//var scoreBuffer = []; // dataPoints
var chart = new CanvasJS.Chart("chartContainer", {
title :{
text: "Motion Score (last few seconds)"
},
data: [{
type: "line",
dataPoints: scoreBuffer
}],
axisY: {
prefix: "",
suffix: "",
includeZero: false
// I need to do something in axisY, right?
},
});
var xVal = 0;
var yVal = 0;
var updateInterval = 100;
var dataLength = 150; // number of dataPoints visible at any point
var updateChart = function (count) {
count = count || 1;
for (var j = 0; j < count; j++) {
//yVal = yVal + Math.round(5 + Math.random() *(-5-5));
scoreBuffer.push({
x: xVal,
y: latestScore // push on the latest analysis score //formerly: yVal
});
xVal++;
}
if (scoreBuffer.length > dataLength) {
scoreBuffer.shift();
}
chart.render();
};
updateChart(dataLength);
setInterval(function(){updateChart()}, updateInterval);
}