antvis/G2

Do you want to work on this issue?

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

[V5]设置柱状图的最大宽度,联通区域不会跟随柱子宽度进行调整 #5500

ChenKun1997 posted onGitHub

<!-- Thank you for reporting an issue. 1. It's RECOMMENDED to submit PR for typo or tiny bug fix. 2. If this's a FEATURE request, please provide: details, pseudo codes if necessary. 3. If this's a BUG, please provide: course repetition, error log and configuration. Fill in as much of the template below as you're able. 4. It will be nice to use to provide a CodePen Link which can reproduce the issue, we provide a CodePen template g2-github-issue. 感谢您向我们反馈问题。 1. 提交问题前,请先阅读 README 中的贡献帮助文档。 2. 我们推荐如果是小问题(错别字修改,小的 bug fix)直接提交 PR。 3. 如果是一个新需求,请提供:详细需求描述,最好是有伪代码实现。 4. 如果是一个 BUG,请提供:复现步骤,错误日志以及相关配置,并尽量填写下面的模板中的条目。 5. 如果可以,请提供尽可能精简的 CodePen 链接,可使用 CodePen 模板 https://codepen.io/leungwensen/pen/WXJgox,方便我们排查问题。 6. 扩展阅读:如何向开源项目提交无法解答的问题 -->

  • G2 Version: 5.1.0
  • Platform: mac
  • Mini Showcase(like screenshots): image
  • CodePen Link:

<!-- Enter your issue details below this comment. -->

代码(直接粘贴在官网示例中跑):

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

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

chart
  .interval()
  .data({
    type: 'fetch',
    value:
      'https://gw.alipayobjects.com/os/antfincdn/8elHX%26irfq/stack-column-data.json',
  })
  .transform({ type: 'stackY' })
  .transform({ type: 'sortX', by: 'y', reverse: true })
  .encode('x', 'year')
  .encode('y', 'value')
  .encode('color', 'type')
  .style({
    maxWidth:80
  })
  chart.interaction('elementHighlightByColor', {
  link: true,
}).state('active', { fill: 'red', linkFillOpacity: 0.5 })
  .state('inactive', { opacity: 0.5 });

chart.render();

目前联通区域是和 Band 有关系的,但是固定宽高没有走 band 比例尺的逻辑。

posted by pearmini over 1 year ago

Fund this Issue

$0.00
Funded
Only logged in users can fund an issue

Pull requests