antvis/G2

CirclePack 修改访问数据的方式 #4734

pearmini posted onGitHub

目前通过 d.data[fieldName] 的去编码数据有点反直觉。

<img src="https://user-images.githubusercontent.com/49330279/223342616-72eef88b-4f5f-46fe-92e0-08792fec46ef.png" width="500" />

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

const chart = new Chart({
  container: 'container',
  padding: 50,
});

const data = {
  name:'f',
  children: [{name:'a', value:123 }, {name:'b', value:234}]
};

chart
  .pack()
  .data({
    value: data
  })
  .layout({
    padding: 5,
  })
  .encode('value', 'value')
  .encode('color', d => d.data.name) // 通过 data 去访问数据
  .style('labelText', (d) =>
    d.r >= 10 && d.height === 0 ? `${d.data.name}` : '',
  );

chart.render();

保持现状,文章说明清楚就好。

posted by pearmini about 2 years ago

Fund this Issue

$0.00
Funded

Pull requests