在Morris图表上添加动画效果

Question

我已经使用Morris JS创建了一个图表。现在，图表简单加载在屏幕上没有任何影响。我想通过添加动画效果让图表更有趣。

这是我的脚本：

<script>
 Morris.Area({
  element: 'chart',
  // json_encode returns JSON representation of a value
  data: <?php echo json_encode($json_data,JSON_UNESCAPED_UNICODE)?>,
  xkey: 'label',
  ykeys: ['value'],
  // Set to false to skip time/date parsing for X values, instead treating 
 them as an equally-spaced series.
  parseTime:false,
  labels: ['<b>Registered Users</b>'],
   pointFillColors: ['#6789ab'],
 pointStrokeColors: ['#112233'],
 lineColors: ['#a9b4d6'],
  resize: true
  });
</script>

我知道它将由css的帮助完成，但我不知道我应该如何执行该程序。

我正在使用的Div盒子是：

<div id="chart"></div>

但我只希望图表显示动画效果

Answer 1

我在这里解释如何使用Morris Chart制作动画效果：how to animate morris bar chart?

这需要进行一些更改。好消息是你可以使用我的包含这些变化的分支:)：https://pierresh.github.io/morris.js/