antvis / antvis/G2

antv V5.2.2 堆叠条形图 如何设置才能让鼠标在画布上移动时对应位置的分类出现背景框

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

Description

### 问题描述

在G2 V5.2.2版本下使用以下代码无效
const chart = new Chart({
container: 'container',
autoFit: true,
});

chart
.interval()
.data(data)
.encode('x', '月份')
.encode('y', '月均降雨量')
.encode('color', 'name')
.transform({ type: 'stackY' })
.interaction('elementHighlight', { background: true });

chart.interaction('tooltip', {
shared: true,
showMarkers: false,
});

// interaction方法似乎不支持active-region
chart.interaction('active-region')

chart.render();

### 重现链接

_No response_

### 重现步骤

_No response_

### 预期行为

鼠标在画布上移动时对应位置的分类出现背景框,并且点击背景可以提供回调方便添加其他操作
![1956834e4750061a784809b60df4d89e](https://github.com/user-attachments/assets/95d7ba7f-2715-41c1-8f2b-34901f0c6a79)

### 平台

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

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

![1956834e4750061a784809b60df4d89e](https://github.com/user-attachments/assets/72893af4-6d44-4d71-84e1-28f6f57a32a2)

### 补充说明(可选)

_No response_

Contributor guide

Open the contributing guide

Research direction

Start with the supplied G2 V5.2.2 Chart example and inspect the elementHighlight, tooltip, and active-region interaction entry points. Reproduce the stacked interval chart in Chrome, then confirm that hovering a category shows its background region and clicking it exposes a callback.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
data-visualization
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 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.