npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

ember-cli-morris-charts

v1.0.1

Published

Ember CLI addon wrapper for Morris Charts jQuery plugin

Downloads

49

Readme

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.