New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More
Socket
Sign inDemoInstall
Socket

ember-cli-chartist

Package Overview
Dependencies
Maintainers
1
Versions
35
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

ember-cli-chartist

Addon for Ember CLI wrapper for Chartist.js

  • 0.0.2
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
203
decreased by-18.47%
Maintainers
1
Weekly downloads
 
Created
Source

Chartist.js for Ember-CLI Projects

This is an ember-cli wrapper for Chartist. It allows you to render Chartist charts in your templates using components.

Setup

In an existing ember-cli project. Install with:

npm install --save ember-cli-chartist

In the template where you want the chart to appear:

{{chartist-chart data=model.chartData}}

The data attribute is the only required attribute. It's value should be an object. Check the Chartist docs for expected data structure.

Where does the data come from?

The data can be specified in an Ember route or controller. In the example above it's coming from the model which is defined in the route.

/app/routes/application.js

import Ember from 'ember';

export default Ember.Route.extend({
  model: function () {
    return {
      chartData: {
        labels: ['Day1', 'Day2', 'Day3'],
        series: [
          [5, 4, 8],
          [10, 2, 7],
          [8, 3, 6]
        ]
      }
    }
  }
});

Chart types

There are three types of charts; line, bar, and pie. The default is line. You can change the chart type using the type attribute.

{{chartist-chart type="bar" data=model.chartData}}

Responsive scaling

Chartist charts scale up and down in size. They do so at specified ratios. You can change the ratio using the ratio attribute.

{{chartist-chart ratio="ct-golden-section" data=model.chartData}}

See Chartist docs for the full list of ratios and info on how to create your own.

Development

If you'd like to contribute to this project, that would be swell. Here are some details on doing that.

Installation

  • git clone this repository
  • npm install
  • bower install

Running

Running Tests

  • ember test
  • ember test --server

Keywords

FAQs

Package last updated on 08 Jan 2015

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc