antvis/G2

🐞 :spider 布局在容器缩小时出现截断 #5823

lxfu1 posted onGitHub

问题描述

image

重现链接

https://g2.antv.antgroup.com/zh/examples/general/pie/#spider-label

重现步骤

  1. 官网示例修改下配置即可

预期行为

No response

平台

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

屏幕截图或视频(可选)

No response

补充说明(可选)

No response


/**
 * A recreation of this demo: https://nivo.rocks/pie/
 */
import { Chart } from '@antv/g2';

const chart = new Chart({
  container: 'container',
  autoFit: true
  // width: 500,
  // height: 400,
});

chart.coordinate({ type: 'theta'});

chart
  .interval()
  .data([
    { id: '分类一', value: 526 },
    { id: '分类二', value: 220 },
    { id: '分类三', value: 325 },
    { id: '分类四', value: 561 },
    { id: '分类五', value: 54 },
    { id: '其他', value: 54 },
  ])
  .transform({ type: 'stackY' })
  .encode('y', 'value')
  .encode('color', 'id')
  .scale('color', {
    range: ['#e8c1a0', '#f47560', '#f1e15b', '#e8a838', '#61cdbb'],
  })
  .label({
    position: 'spider',
    text: (d) => `${d.id}\n ${d.value}`
  })
  // .label({
  //   text: 'value',
  //   fontWeight: 'bold',
  //   offset: 14,
  // })
  // .label({
  //   text: 'id',
  //   position: 'spider',
  //   connectorDistance: 0,
  //   fontWeight: 'bold',
  //   textBaseline: 'bottom',
  //   textAlign: (d) => (['c', 'sass'].includes(d.id) ? 'end' : 'start'),
  //   dy: -4,
  // })
  // .style('radius', 4)
  // .style('stroke', '#fff')
  // .style('lineWidth', 2)
  // .animate('enter', { type: 'waveIn' })
  // .legend(false);

chart.render();

这个问题我看看哈

posted by BENcorry over 1 year ago

这个BUG已经修复了,应该是这个PR解决的问题,可以Close掉了 image

https://github.com/antvis/G2/pull/6013

posted by BENcorry about 1 year ago

Fund this Issue

$0.00
Funded

Pull requests