Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

自定义图例设置后,图表上进行点击操作失效 #3182

Closed
1 task
wlpscx opened this issue Jan 7, 2021 · 4 comments
Closed
1 task

自定义图例设置后,图表上进行点击操作失效 #3182

wlpscx opened this issue Jan 7, 2021 · 4 comments

Comments

@wlpscx
Copy link

wlpscx commented Jan 7, 2021

  • I have searched the issues of this repository and believe that this is not a duplicate.

Reproduction link

https://g2.antv.vision/zh/examples/other/other#double-axes

Steps to reproduce

legend设置自定义,custom: true

Environment Info
g2 4.1.4
System window10
Browser chrome最新版
@visiky
Copy link
Member

visiky commented Jan 23, 2021

自定义图例的交互,需要通过监听事件自定义实现 filter;文档搜索下 事件部分:chart.on('legend-item:click', () => {})

@bin-sun
Copy link
Contributor

bin-sun commented Sep 15, 2021

chart.on('legend-item:click', (ev) => {
  const target = ev.target;
  const delegateObject = target.get('delegateObject');
  const item = delegateObject.item; // 图例选项
  // console.log(item, ev.view.geometries);
  console.log(item, ev);

  if (item.unchecked) {
    chart.filter(item.value, (value) => {
      console.log('value', value)
      return value !== item.id;
    })
    // console.log(chart.filterFieldData('London', data))
  } else {
    chart.filter('name', null)
  }
  chart.render();
})

代码如上,遇到问题:点击某个图例隐藏对应图表,当一个隐藏后单击另一个又会显示之前隐藏的。请教怎么解决

@hustcc
Copy link
Member

hustcc commented Oct 9, 2021

ref: #3628

部署官网之后,后续可以在官网可以看到。

@krmao
Copy link

krmao commented Mar 31, 2023

chart.on('legend-item:click', (ev) => {
  const target = ev.target;
  const delegateObject = target.get('delegateObject');
  const item = delegateObject.item; // 图例选项
  // console.log(item, ev.view.geometries);
  console.log(item, ev);

  if (item.unchecked) {
    chart.filter(item.value, (value) => {
      console.log('value', value)
      return value !== item.id;
    })
    // console.log(chart.filterFieldData('London', data))
  } else {
    chart.filter('name', null)
  }
  chart.render();
})

代码如上,遇到问题:点击某个图例隐藏对应图表,当一个隐藏后单击另一个又会显示之前隐藏的。请教怎么解决

以上代码在mac上可以,在windows上失效

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

5 participants