antvis / antvis/G2Plot

🤔 [QUESTION] 点legend图例过滤数据之后,changeData之后过滤失效?

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

Description

### 🐛 Question description [Please make everyone to understand it]
legend-filter 过滤一组数据,但是changeData更新数据后过滤失效了,被过滤的数据又显示出来了,有什么办法吗?
![image](https://user-images.githubusercontent.com/15016442/160525782-6d93f6f4-6587-474f-8555-af6ffa0efda8.png)

### 💻 Link to minimal reproduction

```
import { DualAxes, G2 } from '@antv/g2plot';

const { registerTheme } = G2;

registerTheme('custom-theme', {
colors10: ['#FACDAA', '#F4A49E', '#EE7B91', '#E85285', '#BE408C', '#BE408C'],
/** 20色板 */
colors20: ['#FACDAA', '#F4A49E', '#EE7B91', '#E85285', '#BE408C', '#BE408C', '#942D93'],
});

const uvBillData = [
{ time: '2019-03', value: 350, type: 'uv' },
{ time: '2019-04', value: 900, type: 'uv' },
{ time: '2019-05', value: 300, type: 'uv' },
{ time: '2019-06', value: 450, type: 'uv' },
{ time: '2019-07', value: 470, type: 'uv' },
{ time: '2019-03', value: 220, type: 'bill' },
{ time: '2019-04', value: 300, type: 'bill' },
{ time: '2019-05', value: 250, type: 'bill' },
{ time: '2019-06', value: 220, type: 'bill' },
{ time: '2019-07', value: 362, type: 'bill' },
];

const transformData = [
{ time: '2019-03', count: 800 },
{ time: '2019-04', count: 600 },
{ time: '2019-05', count: 400 },
{ time: '2019-06', count: 380 },
{ time: '2019-07', count: 220 },
];

const dualAxes = new DualAxes('container', {
data: [uvBillData, transformData],
xField: 'time',
yField: ['value', 'count'],
geometryOptions: [
{
geometry: 'column',
isStack: true,
seriesField: 'type',
columnWidthRatio: 0.4,
label: {},
},
{
geometry: 'line',
},
],
legend: {
marker: {
symbol: 'circle',
style: {
lineWidth: 2,
r: 6,
stroke: '#5AD8A6',
fill: '#fff',
},
},
layout: 'vertical',
position: 'right',
itemName: {
formatter: (val) => `@${val}`,
style: {
fill: '#333',
},
},
},
interactions: [
{
type: 'element-highlight',
},
{
type: 'active-region',
},
],
animation: false,
theme: 'custom-theme',
});

dualAxes.render();

setInterval(()=>{
dualAxes.changeData([uvBillData, transformData])
},6000)

```

### 🏞 Expected result

期望changeData之后,对图例的筛选继续生效

### 🚑 Any additional [like screenshots]

* **G2Plot Version**:2.4.12
* **Platform**:react

Contributor guide

Open the contributing guide

Research direction

Start with the DualAxes minimal reproduction and inspect how legend filtering is handled across changeData in G2Plot 2.4.12. Filter a legend item, call changeData, and observe whether the series reappears; done means the selection remains effective after the update.

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
Clearly specified
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.