tangxuke / bizcharts

Powerful data visualization library based on G2 and React.

BizCharts

New charting and visualization library has been released: http://bizcharts.net/products/bizCharts.

Please move to it and we won't maintain the old version soon.

More details about BizCharts

Features

• React es6 grammar
• Easy to use
• Strong expansion capability
• Support most data visualization charts

see more demos

Installation

npm

$ npm install bizcharts

umd

 <script src="https://unpkg.com/bizcharts@${version}/umd/BizCharts.min.js"></script>

dev build

$ git clone https://github.com/alibaba/BizCharts.git
$ cd BizCharts
$ npm install
$ npm run build

dev demo

$ sudo vi /etc/hosts
// add 127.0.0.1 localhost
$ npm run[-script] demo
// open in browser http://localhost:3510/

Usage

import {Chart, Axis, Tooltip, Geom} from "bizcharts";

const data = [...];

<Chart height={400} data={data} forceFit>
  <Axis name="month" />
  <Axis name="temperature" label={{formatter: val => `${val}°C`}} />
  <Tooltip crosshairs={{type : 'y'}} />
  <Geom type="line" position="month*temperature" size={2} color={'city'} />
  <Geom type="point" position="month*temperature" size={4} color={'city'} />
</Chart>

Document

tutorial

• quick start
• chart introduce
• chart type
• data
• DataSet
• dataflow
• theme
• interaction
• animation

api

• BizCharts
• components
  • Chart
  • Coord
  • Axis
  • Geom
  • Label
  • Legend
  • Tooltip
  • Guide
  • Facet
  • View
• Plugin
  • Slider
• others
  • scale
  • shape
  • dataset
  • connector
  • transform
  • theme

FAQ

How to Contribute

We welcome all contributions. You could submit any ideas as pull requests. Thank you for your interest and have a good time. Please let us know how can we help. Do check out issues for bug reports or suggestions first.

License

BizCharts is available under the License MIT.