Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

https://github.com/aomran/ember-cli-chart

A simple ember component for adding Charts
https://github.com/aomran/ember-cli-chart

Last synced: 3 months ago
JSON representation

A simple ember component for adding Charts

Host: GitHub
URL: https://github.com/aomran/ember-cli-chart
Owner: aomran
License: mit
Created: 2014-09-14T00:45:30.000Z (almost 10 years ago)
Default Branch: master
Last Pushed: 2023-07-04T14:56:26.000Z (12 months ago)
Last Synced: 2024-01-09T00:41:14.668Z (5 months ago)
Language: JavaScript
Homepage: https://www.npmjs.org/package/ember-cli-chart
Size: 2.28 MB
Stars: 139
Watchers: 8
Forks: 79
Open Issues: 26
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Contributing: CONTRIBUTING.md
- License: LICENSE.md

Lists

awesome - ember-cli-chart
awesome - ember-cli-chart

README

# Ember Chart

[![CI](https://github.com/aomran/ember-cli-chart/actions/workflows/ci.yml/badge.svg?event=push)](https://github.com/aomran/ember-cli-chart/actions/workflows/ci.yml)
[![Ember Observer Score](https://emberobserver.com/badges/ember-cli-chart.svg)](https://emberobserver.com/addons/ember-cli-chart)

This Ember CLI addon is a simple wrapper for [ChartJS](http://www.chartjs.org/) (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:

```hbs

```

- CHARTTYPE: String; one of the following -- `line`, `bar`, `radar`, `polarArea`, `pie` or `doughnut`.
- 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

```

#### More Resources

- [Screencast on creating bar charts with ember-cli-chart](https://www.emberscreencasts.com/posts/46-bar-charts-with-ember-cli-chart)