When I create dynamically a chart, the first axis label isn’t correct. But when I push the second and next points, it is correct.
Here is the complete code:
<!DOCTYPE html>
<html lang=”en”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″/>
<title>canvasJS</title>
<script src=”canvasjs.js”></script>
<script>
window.onload=function(){
var data = [];
var serie = {type: ‘column’, name: ‘example’, showInLegend: true};
var points = [];
serie.dataPoints = points;
data.push(serie);
var chart = new CanvasJS.Chart(‘canvasjs’,{
title:{
text: ‘title’
},
data: data
});
chart.render();
var bt1 = document.getElementById(“add1”);
var bt2 = document.getElementById(“add2″);
bt1.onclick=function(){
var point = {label:”first”, y: 30};
points.push(point);
chart.render();
}
bt2.onclick=function(){
var point = {label:”second”, y: 60};
points.push(point);
chart.render();
}
}
</script>
</head>
<body>
<div id=”canvasjs” style=”height: 300px; width: 100%;”></div>
<div>
<input type=”button” id=”add1″ value=”add first” />
<input type=”button” id=”add2″ value=”add second” />
</div>
</body>
</html>
.
