How to use the @antv/g2plot.Pie function in @antv/g2plot

To help you get started, we’ve selected a few @antv/g2plot examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github antvis / G2Plot / examples / pie / basic / demo / spider-label.js View on Github external
},
  {
    type: '分类四',
    value: 15,
  },
  {
    type: '分类五',
    value: 10,
  },
  {
    type: '其它',
    value: 5,
  },
];

const piePlot = new Pie(document.getElementById('container'), {
  forceFit: true,
  title: {
    visible: true,
    text: '饼图-图形标签蜘蛛布局',
  },
  description: {
    visible: true,
    text:
      '当把饼图label的类型设置为spider时,标签分为两组,在图表两侧拉线对齐显示。一般来说,蜘蛛布局的label更不容易相互遮挡。',
  },
  radius: 0.8,
  data,
  angleField: 'value',
  colorField: 'type',
  label: {
    visible: true,
github antvis / G2Plot / examples / pie / basic / demo / basic.js View on Github external
},
  {
    type: '分类四',
    value: 15,
  },
  {
    type: '分类五',
    value: 10,
  },
  {
    type: '其它',
    value: 5,
  },
];

const piePlot = new Pie(document.getElementById('container'), {
  forceFit: true,
  title: {
    visible: true,
    text: '多色饼图',
  },
  description: {
    visible: true,
    text:
      '指定颜色映射字段(colorField),饼图切片将根据该字段数据显示为不同的颜色。指定颜色需要将color配置为一个数组。\n当把饼图label的类型设置为inner时,标签会显示在切片内部。设置offset控制标签的偏移值。',
  },
  radius: 0.8,
  data,
  angleField: 'value',
  colorField: 'type',
  label: {
    visible: true,
github antvis / G2Plot / examples / pie / basic / demo / outer-label.js View on Github external
},
  {
    type: '分类四',
    value: 15,
  },
  {
    type: '分类五',
    value: 10,
  },
  {
    type: '其它',
    value: 5,
  },
];

const piePlot = new Pie(document.getElementById('container'), {
  forceFit: true,
  title: {
    visible: true,
    text: '饼图-外部图形标签(outer label)',
  },
  description: {
    visible: true,
    text: '当把饼图label的类型设置为outer时,标签在切片外部拉线显示。设置offset控制标签的偏移值。',
  },
  radius: 0.8,
  data,
  angleField: 'value',
  colorField: 'type',
  label: {
    visible: true,
    type: 'outer',