AntV G2使用中遇到的坑

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
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容