G2Plot 迁移 G2 4.0 遇到的问题汇总

[paleface001]

版本： 4.0.0-beta.12

• [x] tooltip设为follow的情况下对鼠标的躲避不灵敏，速度快的时候经常hover到上面

• [x] tooltip配置crosshair的情况下，吸附效果有问题

  

[simaQ]

法爷，给个复现的 demo 吧

[paleface001]

复现demo: https://riddle.alibaba-inc.com/riddles/faf7e6f2

[paleface001]

2018

[paleface001]

view增加cliper: https://github.com/antvis/scale/issues/32

[paleface001]

scale自动补齐：

{
  type:'interval',
   position:['value']
}

这样的写法报错

[hustcc]

@simaQ 因为 tooltip css 样式导致 g2plot 在网站中会渲染两次。（tooltip 的 dom 撑大容器，然后触发重新渲染）

之前 3.6.x 中也修复的，参考：https://github.com/antvis/G2/pull/1654

另外，这个 tooltip 样式的 pr，也可以看下在 4.0 是否也会存在问题 https://github.com/antvis/G2/pull/1649

[paleface001]

记录一下疑似G的bug： path动画无中间插值效果，待riddle复现

[BlackGanglion]

G2 4.x 无法拿到组件级别的渲染实例，例如：坐标轴标签，这样原本的一些测试逻辑无法实现，能否想之前一样挂载上去？

from G2Plot#631

[paleface001]

这里也记录一下： 坐标系转置的情况下，分组interval的图形顺序与tooltip顺序不匹配 #2068

[simaQ]

G2 4.x 无法拿到组件级别的渲染实例，例如：坐标轴标签，这样原本的一些测试逻辑无法实现，能否想之前一样挂载上去？

from G2Plot#631

哟，可以拿到的。有这么几个方案：

1. 如果是拿 Component 实例，可以这样

const controller = chart.getController('axis');

// 获取所有 Component 实例
const components  = controller.getComponents();

2. 拿 shape 的话，可以直接从对应的图层进行查找

const regionShape = chart.backgroundGroup.findAll((el) => {
      // 根据 shape name 进行查找
      return el.get('name') === 'active-region';
    })[0];

[paleface001]

G2 4.x 无法拿到组件级别的渲染实例，例如：坐标轴标签，这样原本的一些测试逻辑无法实现，能否想之前一样挂载上去？ from G2Plot#631

哟，可以拿到的。有这么几个方案：

1. 如果是拿 Component 实例，可以这样

const controller = chart.getController('axis');

// 获取所有 Component 实例
const components  = controller.getComponents();

1. 拿 shape 的话，可以直接从对应的图层进行查找

const regionShape = chart.backgroundGroup.findAll((el) => {
      // 根据 shape name 进行查找
      return el.get('name') === 'active-region';
    })[0];

哟哟，棒呆

[paleface001]

@BlackGanglion 感觉取components shape的咱可以封成几个util方法，写单测的时候调用~

[BlackGanglion]

G2 4.0 未与 3.6.x 一样对 'null' 值进行处理，导致 getShape 时报错，这个G2、G2Plot 是否需要处理，在哪里处理？

https://riddle.alibaba-inc.com/riddles/c4078fa1

[paleface001]

G2 4.0 未与 3.6.x 一样对 'null' 值进行处理，导致 getShape 时报错，这个G2、G2Plot 是否需要处理，在哪里处理？

https://riddle.alibaba-inc.com/riddles/c4078fa1

可以在 G2Plo t的 processData 方法里处理，对null值这一行数据直接剔除

[BlackGanglion]

散点图 point hover 现象，是否是配置问题？

https://riddle.alibaba-inc.com/riddles/19505374

[BlackGanglion]

G2 4.0 未与 3.6.x 一样对 'null' 值进行处理，导致 getShape 时报错，这个G2、G2Plot 是否需要处理，在哪里处理？ https://riddle.alibaba-inc.com/riddles/c4078fa1

可以在 G2Plo t的 processData 方法里处理，对null值这一行数据直接剔除

恩，我调整一下

[paleface001]

散点图 point hover 现象，是否是配置问题？

https://riddle.alibaba-inc.com/riddles/19505374

在g2plot的getDefaultOptions里配置tooltip，去掉marker:

tooltip:{
  showMarkers: false
}

[BlackGanglion]

使用 alternateColor 为网格设置交替的颜色，指定一个值则先渲染奇数层，两个值则交替渲染

grid alternateColor，3.x 是奇数层先渲染，4.0 是偶数层先渲染

[simaQ]

先关闭了。有问题单独提 issue 吧~