Skip to content
master
Go to file
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
src
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

README.md

npm version

Jelly-Chart

Jelly-Chart is a chart library based on D3v4 and SVG.

chart-types

Chart Types

Documents

Download && Installation

Download

Use CDN

<!-- jsDelivr -->
<script src="//cdn.jsdelivr.net/npm/jelly-chart/dist/jelly.min.js"></script> 
<!-- unpkg -->
<script src="//unpkg.com/jelly-chart/dist/jelly.min.js"></script> 

Install from NPM

$ npm install --save jelly-chart

Dependency

D3 (required)
4+

HTML

<!-- Load D3 and jelly-chart separately -->
<!-- Load D3 first-->
<script src="//d3js.org/d3.v4.min.js"></script>    
<!-- Load jelly-chart after D3 -->
<script src="$PATH/jelly.min.js"></script>

ES6 Module

Jelly-Chart is written using ECMAScript 6 modules. After importing it, you can create a custom bundle using your preferred bundler.

import jelly from "jelly-chart";

Basic Usage

1) Insert a chart holder element

<div id="chart"></div>

2) Call a chart generator

var bar = jelly.bar();
//or
var bar = jelly.type('bar');

3) set a container, data and options, then render

bar.container('#chart')
  .data([
    {x: 'A', y: 10},
    {x: 'A', y: 20},
    {x: 'B', y: 15},
    {x: 'B', y: 10}
  ])
  .dimensions(['x'])
  .measures(['y'])

bar.render();

To find more detailed usages, check Demo and API Docs.

Development

Use NPM Script to build Jelly-chart

# Install dependencies
$ npm install

# Run dev-server for development
$ npm start

# Test
$ npm test

# Build
$ npm run build

** CONTRIBUTING ** Fork to modify or update the content, then modify and request with Pull Request!

LICENSE

GPL-3.0+

You can’t perform that action at this time.