项目作者: VizArtJS

项目描述 :
Artistic Data Visualization
高级语言: JavaScript
项目地址: git://github.com/VizArtJS/vizart.git
创建时间: 2017-07-21T01:32:03Z
项目社区:https://github.com/VizArtJS/vizart

开源协议:MIT License

下载


vizart

It is recommended to use vizart components.

Usage: Components

  1. Install a vizart component:
  1. npm install vizart-basic --save
  1. import and use
  1. import 'vizart-basic/dist/vizart-basic.css';
  2. import { bar } from 'vizart-basic';
  3. const chart = barar(domId, opt)....

Usage: vizart

With this approach, all charts are available.

  1. Install VizArt in your project

    1. npm install vizart --save
  2. import and use

  1. import 'vizart/dist/vizart.css';
  2. import { bar } from 'vizart';
  3. const chart = bar(domId, opt)....

Three steps to use a chart

  1. initialize a chart with domId and declarative options

    1. const opt = {
    2. ...
    3. };
    4. const chart = bar('#chart', opt)

    You only need to provide essential options. Demo is a good place to check essential options for all charts. You may check up Documentation of each component for full option spec so as to control more chart behaviours.

  2. Render a chart with data

    1. chart.render(data) // this should be called only once
  3. Change a chart on the fly
    ```
    // copy and update full options
    const opt = chart.options();
    opt.plots.opacityArea = o.4

// or in minimum
const opt = { plots: {opacityArea: 0.2 }};

// update options
chart.options(opt);
chart.update();
```

Resources

Components

Production ready:

Credits

My work is based on/inspired by other people’s works. You can find links and author names of originals works at each sub module’s home page
as well as at vizart’s demo page.

Thanks to Mike Bostock, the creator of d3.js. I create vizart on top of d3 modules. I also study d3 examples extensively.

License

This project is licensed under the MIT License - see the LICENSE file for details