antvis/G2

如果name重复了柱状图的显示就会有问题 #5825

18211365467 posted onGitHub

问题描述

/**
 * 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.',
});
const data=[
  {name:'我',id:1,ids:3},

   {name:'我1',id:2,ids:3},
    {name:'我2',id:2,ids:3},
       {name:'我1',id:22,ids:3},
    {name:'我2',id:24,ids:3},
     {name:'我3',id:3,ids:3},
      {name:'我4',id:5,ids:3},
       {name:'我5',id:8,ids:3},
        {name:'我6',id:9,ids:3}

  ]
chart
  .interval()
  .data(data)
  .transform({ type: 'sortX', by: 'y', reverse: true, slice: 6 })
  .transform({ type: 'dodgeX' })
  .encode('x', 'name')
  .encode('y', 'id')
  .encode('color', 'ids')
  .scale('y', { nice: true })
  .axis('y', { labelFormatter: '~s' });

chart
  .interaction('tooltip', { shared: true })
  .interaction('elementHighlightByColor', { background: true });

chart.render();

image

重现链接

No response

重现步骤

No response

预期行为

No response

平台

  • 操作系统: [macOS, Windows, Linux, React Native ...]
  • 网页浏览器: [Google Chrome, Safari, Firefox]

屏幕截图或视频(可选)

No response

补充说明(可选)

No response


Fund this Issue

$0.00
Funded

Pull requests