ember-nf-graph
A Component-based DSL for creating graphs in your Ember app. The goal of the library is to create a set of components that allows application or component authors to build graphs in a compositional way. This includes components for templated axes, graph lines, areas, stacked areas, bar graphs, and much more. Check the documentation for more information.
A basic graph example is as follows:
Route;
{{#nf-graph width=500 height=300}} {{#nf-graph-content}} <!-- add a line --> {{nf-line data=model.myLineData}} <!-- add an area --> {{nf-area data=model.myAreaData}} <!-- mix in any SVG element you want --> <circle cx="40" cy="40" r="10"></circle> {{/nf-graph-content}} <!-- axis ticks are templateable as well --> {{#nf-y-axis as |tick|}} <text>{{tick.value}}</text> {{/nf-y-axis}} {{#nf-x-axis as |tick|}} <text>{{tick.value}}</text> {{/nf-x-axis}}{{/nf-graph}}
Installation
This set of Ember components requires Ember-CLI 0.2.0 or higher and Ember 1.10.0 or higher.
To install, simply run ember install ember-nf-graph
, or npm install -D ember-nf-graph
Documentation
- Online at: netflix.github.io/ember-nf-graph/docs (generated by YUIDocs)
- In package: Documentation for these components is included in the package, and can be found under
node_modules/ember-nf-graph/docs/index.html
just open in any browser.
Contributing
git clone
this repositorynpm install
bower install
Running
ember server
- Visit your app at http://localhost:4200.
Running Tests
ember test
ember test --server
Building
ember build
For more information on using ember-cli, visit http://www.ember-cli.com/.
Generating Documenation
This project uses YUIDoc to generate documentation. Once YUIDoc is installed run:
yuidoc -c yuidoc.json
The documentation is located in docs/
.