ember-cli-morris-charts

Ember-cli-morris-charts

This is an ember cli addon to easily create awesome charts using morris charts jquery plugin.

The plugin has been wrapped in this ember addon so you can use it with your controller or model properties, whenever data is updated, the chart will also update.

Demo

https://matheusdavidson.github.io/ember-cli-morris-charts

Installation

jQuery must be loaded in your project, in next releases this will be done automatically

npm install --save-dev ember-cli-morris-charts

Usage

For now, only the basic options are working, but i will implement everything very soon!
There are 4 types of charts available(Area, Line, Bar, Donut), acording to morris charts docs:

Area
{{morris-charts type="Area" data=DATA xKey=XKEY yKeys=YKEYS labels=LABELS resize=RESIZE}}

Line
{{morris-charts type="Line" data=DATA xKey=XKEY yKeys=YKEYS labels=LABELS resize=RESIZE}}

Bar
{{morris-charts type="Bar" data=DATA xKey=XKEY yKeys=YKEYS labels=LABELS resize=RESIZE}}

Donut
{{morris-charts type="Donut" data=DATA resize=RESIZE}}

You can use the tags above in your templates and provide extra properties (like data, xKey, yKeys, Labels and resize)in your model or controllers.

Available options

TYPE
String(Area, Line, Bar, Donut)
DATA
Array, refer to morris chart docs according to TYPE
XKEY
String, should be one of your DATA array key, refer to morris chart docs
yKEYS
Array, should be an array with your DATA keys that you want displayed on y series, refer to morris chart docs
LABELS
Array, Label for each key in your y series, refer to morris chart docs
RESIZE
Bool, True will make the chart responsive, defaults to false(not responsive)

Questions?

This is a new project, but many people are already using it successfully. If you have any trouble, open an issue, and you should get help quickly.