美文网首页
AntV G2使用中遇到的坑

AntV G2使用中遇到的坑

作者: 花泽香个菜菜 | 来源:发表于2018-05-25 17:49 被阅读0次

    AntV使用在语法上和highcharts、echarts大相径庭,在初次使用时的感受会很酸爽,特别是定制化需求时‘看文档两小时,代码一小行’会很常见。这里罗列一下自己遇到的一些“坑”,且将持续更新:

    1. 图形的渲染:
      渲染时在设置完legend、tooltip、source等一系列后最后一步chart.render()。 其中chart的来源如下(以折线图为例):
      import G2 from '@antv/g2';
      chart = new G2.Chart({
      container: chartId,
      forceFit: true,
      height: 400,
      padding: [20, 'auto', 30, 'auto']
      });
      ....... //各种配置balabala
      chart.render() //最后一步渲染至画布
    2. 图形的更新
      图形数据或者tooltip需要根据需求改变时,最后一步chart.repaint()。其中chart的来源同上,可以将chart抽象至全局用于公用。
      step1:更新数据可以用chart.changeData([....]),
      step2:修改tooltip格式和内容时chart.tooltip({.....}),
      stepN:其他属性的修改可参考上一条,
      step last: chart.repaint();
      //一定要最后执行这一步,否则会出现数据更新了但是tooltip等滞后更新的情况,呵呵哒我排查了俩小时才发现这个坑!
      F53315A2-ACBA-4de8-8A9B-9A3E50612D11.png

    相关文章

      网友评论

          本文标题:AntV G2使用中遇到的坑

          本文链接:https://www.haomeiwen.com/subject/ixuujftx.html