Awesome
Ember Chart
This Ember CLI addon is a simple wrapper for ChartJS (v3.5).
Compatibility
- Ember.js v3.20 or above
- Ember CLI v3.20 or above
- Node.js v12 or above
Installation
$ ember install ember-cli-chart
Usage
In your handlebars template just do:
<EmberChart
@type={{CHARTTYPE}}
@data={{CHARTDATA}}
@options={{CHARTOPTIONS}}
@width={{CHARTWIDTH}}
@height={{CHARTHEIGHT}}
@plugins={{CHARTPLUGINS}}
@customLegendElement={{CUSTOMLEGENDELEMENT}}
/>
- CHARTTYPE: String; one of the following --
line
,bar
,radar
,polarArea
,pie
ordoughnut
. - CHARTDATA: Array; refer to the ChartJS documentation
- CHARTOPTIONS: Object; refer to the ChartJS documentation. This is optional.
- CHARTWIDTH: Number; pixel width of the canvas element. Only applies if the chart is NOT responsive.
- CHARTHEIGHT: Number; pixel height of the canvas element. Only applies if the chart is NOT responsive.
- CHARTPLUGINS: Array; refer to ChartJS documentaion. This is optional.
- CUSTOMLEGENDELEMENT: HTMLElement; A custom element to put a custom legend in, when using
legendCallback
. This is optional.
Example
<EmberChart @type="pie" @data={{model.chartData}} @width={{200}} @height={{200}} />