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

【v5】图例显隐后 elementHighlightByColor 交互永久失效 #5529

Closed
Deathsteps opened this issue Sep 11, 2023 · 3 comments · Fixed by #5845
Closed

【v5】图例显隐后 elementHighlightByColor 交互永久失效 #5529

Deathsteps opened this issue Sep 11, 2023 · 3 comments · Fixed by #5845

Comments

@Deathsteps
Copy link
Contributor

问题描述

首次生效效果
image

关闭图例
image

再打开图例
image

期望结果

图例开关不影响元素高亮效果

如何重现

官方代码修改

/**
 * A recreation of this demo: https://observablehq.com/@d3/grouped-bar-chart
 */
import { Chart } from '@antv/g2';

const chart = new Chart({
  container: 'container',
  autoFit: true,
});

chart.title({
  title: 'Population by age and state',
  subtitle: 'It shows the population of U.S. by age and state.',
});

chart
  .interval()
  .data({
    type: 'fetch',
    value:
      'https://gw.alipayobjects.com/os/bmw-prod/f129b517-158d-41a9-83a3-3294d639b39e.csv',
    format: 'csv',
  })
  .transform({ type: 'sortX', by: 'y', reverse: true, slice: 6 })
  .transform({ type: 'dodgeX' })
  .encode('x', 'state')
  .encode('y', 'population')
  .encode('color', 'age')
  .scale('y', { nice: true })
  .axis('y', { labelFormatter: '~s' });

chart
  .state('inactive', { opacity: 0.5 })
  .interaction('tooltip', { shared: true })
  .interaction('elementHighlightByColor', {
    background: true,
    link: false,
  });

chart.render();

额外信息

  • G2 5.1.0 版本
@pearmini
Copy link
Member

有可能是 elementHighlight 交互没有重新挂载。

@Calmio-Y
Copy link

没有修复成功呢,使用上述代码在官网测试,没有通过

@Calmio-Y
Copy link

@pearmini

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

Successfully merging a pull request may close this issue.

3 participants