5.11. 自定义图表

新建图表时,将图表类型设置为自定义,即可自定义图表渲染逻辑。

自定义图表不能单独展示,需要将其添加到看板中, 并在对应图表组件HTML元素上定义dg-chart-renderer属性, 然后将这个属性值设置为一个作为此图表渲染器的JS对象名 (此图表渲染器对象与下面自定义图表插件的chartRenderer格式和用法一致)。

例如:

  1. ...
  2. <script type="text/javascript">
  3. var myChartRenderer=
  4. {
  5. render: function(chart)
  6. {
  7. chart.elementJquery().append("<div>render custom chart</div>");
  8. },
  9. update: function(chart, results)
  10. {
  11. chart.elementJquery().append("<div>update custom chart</div>");
  12. }
  13. };
  14. </script>
  15. ...
  16. <div dg-chart-widget="..." dg-chart-renderer="myChartRenderer"></div>
  17. ...