antvis / antvis/G2Plot

🐛 [BUG] When I set annotation's type as 'html' and then register an 'annotation:click' event on the chart, the callback can't be invoked.

Open
#3,690 0 comments 0 reactions 0 assignees View on GitHub
Bug
Dominant language
TypeScript
Stars
2.7k
Forks
591
PR merge metrics
No merged PRs in 30d

Description

### 🐛 Bug description [Please make everyone to understand it]
[issue case](https://codesandbox.io/s/xr7xzd)

### 📷 Step to reproduce
```ts
import { Column } from '@antv/g2plot';

const data = [
{ type: '分类一', value: 27 },
{ type: '分类二', value: 25 },
{ type: '分类三', value: 18 },
{ type: '分类四', value: 15 },
{ type: '分类五', value: 10 },
{ type: '其他', value: 5 },
];

const plot = new Column('container', {
width: 400,
height: 300,
autoFit: false,
appendPadding: 0,
data,
yField: 'value',
xField: 'type',
label: false,
annotations: [
{
type: 'html',
html: ``,
/** 位置 */
// ✅ 3. 支持回调设置,转换为百分比例。yScale 有多个,需要获取到具体 y轴字段对应的 scale
position: ['分类三', 25],
},
],
});

plot.on('annotation:click', () => {
console.log('sdsd');
});

plot.render();
```
If you click the annotation that rendered with svg, the console hasn't any output.

### 🏞 Expected result

### 🚑 Any additional [like screenshots]

* **G2Plot Version**: 2.4.25
* **Platform**: macOS

Contributor guide

Open the contributing guide

Research direction

Start from the Column example's annotations configuration and the plot.on('annotation:click') entry point, then reproduce the linked CodeSandbox with an HTML/SVG annotation. Done means clicking the rendered annotation invokes the registered callback as expected.

Written by the indexing model from the issue text.

Assessment

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

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.