[rayateng]

Thank you for telling :)

[rayateng]

Thank you very much for your kindly :) .

[rayateng]

Thanks brother, but if I want to make graph still running when refresh page so I can’t use static interval. That’s why I need to use timer for interval axisX and Y but I can’t set it correct :(

[rayateng]

here: https://jsfiddle.net/rayateng/5ure8q33/
I want to set dynamic axisX get from timer for increase.

[rayateng]

wow…wonderful! Thank you so much brother :)

[rayateng]

I’m sorry brother I can’t use it so example me in jsfiddle please…

[rayateng]

Thank you so much for answer quickly :) I got it. But if I use like this code ” chart.options.subtitles.verticalAlign = “center”; ” it doesn’t working and if I want to use Title and subtitles in the same verticalAlign: center, it can’t too. Please help me because I want to use this two title on center.

[rayateng]

Thank you brother for help me :)

[rayateng]

Thank you very much for your help. Could I ask you some about how to show back to default template of chart line?

[rayateng]

I’m sorry maybe you hard to understand my meaning. But please test on my code you will see axisY has many interval so how can I custom it?

• This reply was modified 6 years, 4 months ago by rayateng. Reason: write wrong

[rayateng]

this is my code:
<script>
window.onload = function () {

var dps = []; // dataPoints
var chart = new CanvasJS.Chart(“chartContainer”, {
title :{
text: “Dynamic Data”
},
data: [{
type: “spline”,
markerType: “none”, //”circle”, “square”, “cross”, “none”
lineThickness: 4,
color: “black”,
dataPoints: dps
}]
});

var xVal = 0;
var yVal = 0;
var updateInterval = 100;
var dataLength = 1; // number of dataPoints visible at any point
var ms = 0;

var updateChart = function (count) {

count = count || 1;

for (var j = 0; j < count; j++) {
yVal = Math.floor(100 * Math.pow(Math.E, 0.00006 * ms)) / 100;
dps.push({
x: xVal,
y: yVal
});
xVal = xVal+0.02;
ms=ms+100;
}
console.log(‘X= ‘+JSON.stringify(xVal)+’ Y= ‘+JSON.stringify(yVal));

//=========== yVal ==================
if(yVal <= 1.8){
chart.options.axisY = {
gridThickness: 0,
suffix: “x”,
viewportMinimum:1,
viewportMaximum:1.8,
interval:0.2,
};
}
else if(yVal <= 3.03){
chart.options.axisY = {
gridThickness: 0,
suffix: “x”,
viewportMinimum:1,
interval:0.01,
};
}
//=========== xVal ==================
if(xVal <= 1.9800000000000013){
chart.options.axisX = {
viewportMinimum:0,
viewportMaximum:2,
interval:0.5,
};
}
else if(xVal <= 3.700000000000003){
chart.options.axisX = {
viewportMinimum:0,
interval:0.5,
};
}
chart.render();
};

updateChart(dataLength);
setInterval(function(){updateChart()}, updateInterval);

}
</script>