data driven react components of echarts


Keywords
data, react, echarts, component
License
MIT
Install
npm install d2recharts@0.6.26

Documentation

d2recharts

Data Driven echarts wrapped as react components.

what?

data-flow

Why?

To make the path from data to chart shorter.

Install

npm i d2recharts --save

Usage

A typical use case is like:

<D2Pie
    data={[
       {value:335, name:'直接访问'},
       {value:310, name:'邮件营销'},
       {value:234, name:'联盟广告'},
       {value:135, name:'视频广告'},
       {value:1548, name:'搜索引擎'}
    ]}
/>

Simplest use case:

const data = [
    // data goes here
];
<D2RechartsSmart data={data} />

If you want fully functionality of echarts:

const option = {
    // echarts option goes here
};
<D2Recharts option={option} />

Demo

API

Roadmap

Contributing

Thanks to

  • echarts: one of the greatest open source project for graphing.
  • echarts-for-react: where the core react wrapping is stolen from.