Javascript-图表在完成动画后消失

我试图使用chartjs,所以我从official document复制了示例代码,如下所示.

<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>

示例：http://jsfiddle.net/DerekL/FZW9z/

图表首先出现,但是当第一个动画结束时,它消失了.
Javascript控制台什么也没显示.当选项动画定义为false时,它仅会瞬间出现并消失.

我在Mac的Firefox和Chrome中尝试过,但结果相同.

它是如何发生的,我该如何解决？

解决方法:

您实际上是两次调用新的Chart().请参见下面的代码.我连接了不需要的线路.另请参阅更新的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>

标签：chart-js,javascript
来源： https://codeday.me/bug/20191122/2056787.html