https://github.com/fusioncharts/backbone-fusioncharts
Backbone component for FusionCharts
https://github.com/fusioncharts/backbone-fusioncharts
backbonejs fusioncharts wrapper
Last synced: over 1 year ago
JSON representation
Backbone component for FusionCharts
- Host: GitHub
- URL: https://github.com/fusioncharts/backbone-fusioncharts
- Owner: fusioncharts
- License: mit
- Created: 2018-03-28T03:18:36.000Z (about 8 years ago)
- Default Branch: master
- Last Pushed: 2018-03-30T07:07:13.000Z (about 8 years ago)
- Last Synced: 2025-02-04T05:04:09.170Z (over 1 year ago)
- Topics: backbonejs, fusioncharts, wrapper
- Language: JavaScript
- Homepage:
- Size: 1.12 MB
- Stars: 3
- Watchers: 12
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
#### [Demos and Documentation](https://fusioncharts.github.io/backbone-fusioncharts/)
# backbone-fusioncharts
A simple and lightweight Backbone wrapper which provides bindings for FusionCharts JavaScript Charting Library. It easily adds rich and interactive charts to any Backbone Project.
## Installation from npm
To install `backbone-fusioncharts`, run:
```bash
$ npm install backbone-fusioncharts --save
```
To install `backbone`, run:
```bash
$ npm install backbone --save
```
To install `fusioncharts`, run:
```bash
$ npm install fusioncharts --save
```
Import `backbone-fusioncharts` in your Backbone web application using any of the CommonJS, ES6 or AMD include style.
**CommonJS**
```js
const BackboneFusionCharts = require('backbone-fusioncharts');
```
**ES6**
```js
import BackboneFusionCharts from 'backbone-fusioncharts';
```
**AMD**
```js
define(['backbone-fusioncharts'], (BackboneFusionCharts) => {
});
```
## Installation from bower
To install `backbone-fusioncharts`, run:
```bash
$ bower install backbone-fusioncharts --save
```
To install `backbone`, run:
```bash
$ bower install backbone --save
```
To install `fusioncharts`, run:
```bash
$ bower install fusioncharts --save
```
Import `backbone-fusioncharts` in your Backbone web application through HTML script tag.
**HTML**
```html
```
## Getting Started
For rendering a simple chart use the following code
```js
const dataSource = {
chart: {
caption: 'Backbone FusionCharts Sample',
theme: 'fint',
},
data: [
{ value: 1.9 },
{ value: 2.3 },
{ value: 2.1 },
],
};
const fc = new BackboneFusionCharts({
renderAt: 'chart-container',
type: 'Pie2d',
dataSource,
});
fc.model // This is the model
fc.view // This is the view
fc.view.chart // This is the FusionCharts instance
```
Here's the HTML template for the above example
```html
```
## Test
```sh
$ npm test
```
## Contributing
* Clone the repository
* Install dependencies
* Build the library
* Build the sample script
* Open the sample template in your browser
```sh
$ git clone https://github.com/fusioncharts/backbone-fusioncharts.git
$ cd backbone-fusioncharts
$ npm i
$ npm run build
$ npm run build:example
```
To build, run:
```sh
$ npm run build
```
### [Demos and Documentation](https://fusioncharts.github.io/backbone-fusioncharts/)