简介

为了更好地在 react 组件中使用 G2,我们封装了 g2-react 组件。

具体的封装形式可查看源码: https://github.com/antvis/g2-react/blob/master/src/index.js

安装方式

  1. $ npm install g2 --save
  2. $ npm install g2-react --save

注:g2-react 对 g2 的依赖是 peerDeps, 你可以在项目中指定依赖的 g2 的具体版本。

使用方式

  1. import createG2 from 'g2-react';
  2. import { Stat } from 'g2';
  3. const Pie = createG2(chart => {
  4. chart.coord('theta');
  5. chart.intervalStack().position(Stat.summary.proportion()).color('cut');
  6. chart.render();
  7. });
  8. React.render(
  9. <Pie
  10. data={this.state.data}
  11. width={this.state.width}
  12. height={this.state.height}
  13. plotCfg={this.state.plotCfg}
  14. ref="myChart"
  15. />
  16. );

更多的配置请至 github 查看。

实例

参见 g2-react demo