antvis / antvis/G2

【v5】径向图中的 point shape 不支持 waveIn 动画

Open
#6,233 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
12.6k
Forks
1.7k
PR merge metrics
No merged PRs in 30d

Description

### 问题描述

@antv/g2 v5 版本中在 `radiual` 坐标系下 `point` shape 不支持 waveIn 动画
报错提示
```
undefined is not iterable (cannot read property Symbol(Symbol.iterator))
```

### 重现链接

https://codesandbox.io/p/sandbox/tender-hofstadter-w5w6zj

### 重现步骤

### 问题发现
在配置仪表盘中的 indicator 部分 waveIn 动画时发现配置不生效,期望的效果是仪表盘指针从 0% 旋转至指定位置
尝试过参考 `gauge` 的源码,在 radial 坐标下通过自定义 indicator 的 shape(point)尝试实现动画效果,发现仍然报错
```
TypeError: undefined is not iterable (cannot read property Symbol(Symbol.iterator))
at sub (vector.js:1:1)
at getArcObject (utils.js:121:1)
at waveIn.js:31:1
at plot.js:1010:1
at plot.js:666:1
```
对异常处断点,对比 interval 和 point 在 `animation/waveIn` 动画下的参数,发现 `shape.__data__` 中 `y1` 属性缺失导致报错

### 进一步地发现
直接在 径向图 Demo 中配置动画也是会报错的 [Demo](https://codesandbox.io/p/sandbox/hopeful-elgamal-3vx3n3)

### 参考内容
参考 [mark.label 支持动画](https://github.com/antvis/G2/issues/4668) 和 [折线图动画](https://g2.antv.antgroup.com/examples/animation/group#line) 可知 point 动画在 直角坐标系下是没有问题的

### 预期行为

我期望看到 Point 类的 Shape 在 `radial` 坐标系下也可以有 `waveIn` 的动画效果
我实际看到的 会报错/动画不生效/极端情况下 point 类的 shape 无法渲染

### 平台

- 操作系统: [macOS]
- 网页浏览器: [Google Chrome]

### 屏幕截图或视频(可选)

_No response_

### 补充说明(可选)

_No response_

Contributor guide

Open the contributing guide

Research direction

Reproduce the failure using the linked CodeSandbox demos, then trace the reported animation/waveIn stack through getArcObject in utils.js and the related vector.js and plot.js calls. Compare the __data__ passed for interval and point shapes in radial coordinates, focusing on the missing y1 value. Done means point shapes render without the iterable error and waveIn animates from 0% to the target position.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
data-visualization
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.