ember-basic-charts

A collection of charts written for and in Ember. No dependecies apart from the default Ember packages.

Included charts

• Pie chart
• Bar chart
• Value range chart

Pie Chart

Data

slices = [
  { "label":"One",    "value":1 },
  { "label":"Two",    "value":2 },
  { "label":"Three",  "value":3 },
  { "label":"Four",   "value":4 },
  { "label":"Five",   "value":5, "color": '#006' }
]

Minimal

{{pie-chart
  slices=slices
}}

All options

{{pie-chart
  slices=slices
  slicesMax=4
  radius=70
  tilt=315
  borderColor="rgba(255,255,255,0.5)"
  bumpBy=5
  otherLabel="Other"
  otherColor="#dddddd"
  emptyColor="#eeeeee"
  noDataMessage="No data"
  seedColor="#d13f19"
}}

Bar Chart

Data

data: [
  { position: 10, label: "Ten",       value: 5 },
  { position: 13, label: "Thirteen",  value: 3 },
  { position: 20, label: "Twenty",    value: 7 },
]

Usage

{{bar-chart
  data=data
}}

Value range chart

Range

{{value-range-chart
  start=20
  stop=70
}}

Single line

{{value-range-chart mid=30}}

Line and range with altered minimum and maximum

{{value-range-chart
  min=20
  max=140
  start=30
  stop=120
  mid=50
}}

Installation

• git clone <repository-url> this repository
• cd ember-basic-charts
• npm install

Running

• ember serve
• Visit your app at http://localhost:4200.

Running Tests

• npm test (Runs ember try:each to test your addon against multiple Ember versions)
• ember test
• ember test --server

Building

• ember build

For more information on using ember-cli, visit https://ember-cli.com/.