@spytec/react-c3js

React component for C3.js. Cloned from bcbcarl/react-c3js

Stats

StarsIssuesVersionUpdatedCreatedSize
@spytec/react-c3js
2110.3.12 years ago2 years agoMinified + gzip package size for @spytec/react-c3js in KB

Readme

react-c3js

NPM version

React component for C3.js. (Demo)

screenshot

import C3Chart from 'react-c3js';
import 'c3/c3.css';

const data = {
  columns: [
    ['data1', 30, 200, 100, 400, 150, 250],
    ['data2', 50, 20, 10, 40, 15, 25]
  ]
};

const mountNode = document.getElementById('react-c3js');

ReactDOM.render(<C3Chart data={data} />, mountNode);

You can see the docs for more details.

Installation

$ npm install --save c3 react-c3js

Contributing

Yarn / NPM

  1. Modify src/index.js.
  2. Build the lib by using npm run build or make build.
  3. Import C3Chart from react-c3js.
  4. See the result.

Docker

docker build -t react-c3js .
docker run --rm -p 9966:9966 --name react-c3js react-c3js
docker stop react-c3js

Properties

Check out C3.js Reference for more details.

  • data
  • title
  • size
  • padding
  • color
  • interaction
  • transition
  • oninit
  • onrendered
  • onmouseover
  • onmouseout
  • onresize
  • onresized
  • axis
  • grid
  • regions
  • legend
  • tooltip
  • subchart
  • zoom
  • point
  • line
  • area
  • bar
  • pie
  • donut
  • gauge
  • className
  • style
  • unloadBeforeLoad
    • boolean - will unload data before loading
  • unloadFields
    • string[] - will unload specified fields before loading, only works when unloadBeforeLoad is enabled.
  • onPropsChanged

License

MIT

If you find any bugs or have a feature request, please open an issue on github!

The npm package download data comes from npm's download counts api and package details come from npms.io.