Chart disappears just after finishing animation
chart.js, javascript
Solution
You are actually calling the new Chart() twice. Please see the below code. I connected out the unwanted line. Also please see the updated JSFiddle http://jsfiddle.net/sajith/VW4U5/
<canvas id="myChart" width="400" height="400"></canvas>
<script>
var data = {
labels : ["January","February","March","April","May","June","July"],
datasets : [
{
fillColor : "rgba(220,220,220,0.5)",
strokeColor : "rgba(220,220,220,1)",
pointColor : "rgba(220,220,220,1)",
pointStrokeColor : "#fff",
data : [65,59,90,81,56,55,40]
},
{
fillColor : "rgba(151,187,205,0.5)",
strokeColor : "rgba(151,187,205,1)",
pointColor : "rgba(151,187,205,1)",
pointStrokeColor : "#fff",
data : [28,48,40,19,96,27,100]
}
]
}
//Get the context of the canvas element we want to select
var ctx = document.getElementById("myChart").getContext("2d");
//var myNewChart = new Chart(ctx).PolarArea(data);
new Chart(ctx).Line(data);
</script>
Problem
I'm trying to use `chartjs`, so I copied sample code from official document like this. ``` <canvas id="myChart" width="400" height="400"></canvas> <script> var data = { labels : ["January","February","March","April","May","June","July"], datasets : [ { fillColor : "rgba(220,220,220,0.5)", strokeColor : "rgba(220,220,220,1)", pointColor : "rgba(220,220,220,1)", pointStrokeColor : "#fff", data : [65,59,90,81,56,55,40] }, { fillColor : "rgba(151,187,205,0.5)", strokeColor : "rgba(151,187,205,1)", pointColor : "rgba(151,187,205,1)", pointStrokeColor : "#fff", data : [28,48,40,19,96,27,100] } ] } //Get the context of the canvas element we want to select var ctx = document.getElementById("myChart").getContext("2d"); var myNewChart = new Chart(ctx).PolarArea(data); new Chart(ctx).Line(data); </script> ``` Example: http://jsfiddle.net/DerekL/FZW9z/ The Chart appears at first, but when first animation ends it disappears. Javascript console shows nothing. And when a option `animation` is defined `false`, then it appears only split second and disappears likewise. I tried in Firefox and Chrome in Mac, but results were same. How does it happens, and how can I fix it?