antvis/G2

Do you want to work on this issue?

You can request for a bounty in order to promote it!

在使用 空间复合 的时候,legend 点击报错 无效果 #6240

lcldyh posted onGitHub

xiaolong01

https://g2.antv.antgroup.com/zh/examples/composition/space#space-layer

import { Chart } from '@antv/g2';

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

const scaleColor = (node) =>
  node.scale('color', {
    palette: 'cool',
    offset: (t) => t * 0.8 + 0.1,
  });

const layer = chart.spaceLayer().data({
  type: 'fetch',
  value:
    'https://gw.alipayobjects.com/os/bmw-prod/fb9db6b7-23a5-4c23-bbef-c54a55fee580.csv',
  format: 'csv',
});

layer
  .interval()
  .transform({ type: 'sortX', reverse: true, by: 'y' })
  .encode('x', 'letter')
  .encode('y', 'frequency')
  .encode('color', 'letter')
  .call(scaleColor);

layer
  .interval()
  .attr('x', 300)
  .attr('y', 50)
  .attr('width', 300)
  .attr('height', 300)
  .coordinate({ type: 'theta' })
  .transform({ type: 'stackY' })
  .legend(false)
  .scale('color', {
    palette: 'cool',
    offset: (t) => t * 0.8 + 0.1,
  })
  .encode('y', 'frequency')
  .encode('color', 'letter')
  .call(scaleColor);

chart.render();

并且使用 legend:filte 交互的时候会把所有的 legend 都干没了;

chart.emit('legend:filter', { data: { channel: 'color', values: ['Sports', 'Strategy'] }, });

posted by CullenNg 10 months ago

Fund this Issue

$0.00
Funded
Only logged in users can fund an issue

Pull requests