Skip to content

This issue was moved to a discussion.

You can continue the conversation there. Go to discussion →

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】左右位置的 legend 显示不全 #5294

Closed
Deathsteps opened this issue Jul 11, 2023 · 0 comments
Closed

【v5】左右位置的 legend 显示不全 #5294

Deathsteps opened this issue Jul 11, 2023 · 0 comments

Comments

@Deathsteps
Copy link
Contributor

问题描述

image

放宽 legend width,又会导致排列错乱

image

期望结果

左右位置的 legend 默认可以显示全

如何重现

官方代码修改

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

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

chart
  .interval()
  .data({
    type: 'fetch',
    value:
      'https://gw.alipayobjects.com/os/bmw-prod/f129b517-158d-41a9-83a3-3294d639b39e.csv',
    format: 'csv',
  })
  .transform({ type: 'stackY' })
  .transform({ type: 'sortX', by: 'y', reverse: true })
  .encode('x', 'state')
  .encode('y', 'population')
  .encode('color', 'age')
  .axis('x', {
    labelSpacing: 4,
    style: {
      labelTransform: 'rotate(90)',
    },
  })
  .axis('y', { labelFormatter: '~s' })
  .legend({ color: {
    position: 'right',
    width: 90
  }});

chart.render();

额外信息

  • G2 5.0.15 版本
@antvis antvis locked and limited conversation to collaborators Jul 12, 2023
@pearmini pearmini converted this issue into discussion #5301 Jul 12, 2023

This issue was moved to a discussion.

You can continue the conversation there. Go to discussion →

Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant