g2-react

Factory wrapper for using G2 easier in a React Component with dynamic data and size props

Note that g2-react is just a wrapper, if you want to make a better chart, docs of G2 is HERE

Example

• online example

• local example

Install

$ npm install g2 --save
$ npm install g2-react --save

g2-react works with a peerDependencies of g2, you can specify the version of g2 in your package.json

Usage

import createG2 from 'g2-react';
import { Stat } from 'g2';

const Pie = createG2(chart => {
  chart.coord('theta');
  chart.intervalStack().position(Stat.summary.proportion()).color('cut');
  chart.render();
});

React.render(
  <Pie
    data={this.state.data}
    width={this.state.width}
    height={this.state.height}
    plotCfg={this.state.plotCfg}
    ref="myChart"
  />
);

Note that you can make a dynamic props wrap just like higherWrapper demo

Props

See detail api of g2

Development

$ git clone [email protected]:antvis/g2-react.git
$ npm install
$ npm run doc

License

g2-react is released under the MIT license.

1.3.1

• [fix] allow data as G2.frame

1.3.0

• [feat] support createG2((chart, configs)), read configs from , !24
• [fix] legacy deps, #39

1.2.0

• [performance] react component should NOT update
• [docs] add higherWrapper demo

1.0.1

• [fix] pkg.main path

1.0.0

• let there be rc-g2