elementHighlight在折线图中设置无效
- Dominant language
- TypeScript
- Stars
- 12.6k
- Forks
- 1.7k
- PR merge metrics
- No merged PRs in 30d
Description
### 问题描述
`
import { Chart } from '@antv/g2';
const data = [
{ year: '1991', value: 3 },
{ year: '1992', value: 4 },
{ year: '1993', value: 3.5 },
{ year: '1994', value: 5 },
{ year: '1995', value: 4.9 },
{ year: '1996', value: 6 },
{ year: '1997', value: 7 },
{ year: '1998', value: 9 },
{ year: '1999', value: 13 },
];
const chart = new Chart({
container: 'container',
autoFit: true,
});
chart
.data(data)
.encode('x', 'year')
.encode('y', 'value')
.scale('x', {
range: [0, 1],
})
.interaction('elementHighlight', { background: true })
.scale('y', {
domainMin: 0,
nice: true,
});
chart.line().label({
text: 'value',
style: {
dx: -10,
dy: -12,
},
});
chart.point().style('fill', 'white').tooltip(false);
chart.render();
`
### 重现链接
https://codesandbox.io/p/sandbox/crazy-fire-35tpfw?file=%2Findex.ts%3A13%2C3
### 重现步骤
_No response_
### 预期行为
隐藏高亮线
### 平台
- 操作系统: [macOS, Windows, Linux, React Native ...]
- 网页浏览器: [Google Chrome, Safari, Firefox]
### 屏幕截图或视频(可选)
_No response_
### 补充说明(可选)
_No response_
Contributor guide
Research direction
Start with the index.ts reproduction in the linked CodeSandbox and inspect the elementHighlight interaction with the line chart and point layer. Confirm the expected behavior of hiding the highlight line, then verify the behavior against the provided example after the fix.
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
- 38/100