sgotre / angular-morris-chart

Directives of Morris.js for Angular 1.x :coffee:

angular-morris-chart

A module with directives to easy use of morris with angular

Installation

Install angular-morris-chart through

Bower

$ bower install angular-morris-chart --save

Npm

$ npm install angular-morris-chart --save

Download

From master branch

CDN

Minified version: https://cdnjs.cloudflare.com/ajax/libs/angular-morris-chart/1.2.0/angular-morris-chart.min.js

Full version: https://cdnjs.cloudflare.com/ajax/libs/angular-morris-chart/1.2.0/angular-morris-chart.js

Add morris.js and its dependencies

jQuery & Raphaël to your page

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/raphael/2.1.0/raphael-min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/morris.js/0.5.1/morris.min.js"></script>

Add our module

<script src="//cdnjs.cloudflare.com/ajax/libs/angular-morris-chart/1.2.0/angular-morris-chart.min.js"></script>

Inject dependency

Make sure you injected angular.morris-chart into your angular app

angular.module('my.app', [
    'angular.morris-chart'
])

Usage

There are four directives based on morris.js

• bar-chart
• line-chart
• donut-chart
• area-chart

Working fiddle sample

How-to´s

• Usage of dataFormat with line charts #45 https://jsfiddle.net/stewones/q8mcqm8k/

• $scope issues related #42 https://jsfiddle.net/stewones/0qqs6rhb/

• Working with async calls https://jsfiddle.net/stewones/xtuso6q8/

• Usage of goalLineColors https://jsfiddle.net/stewones/9zjasq3r/

• Usage of postUnits https://jsfiddle.net/stewones/n6aaLckb/

---

Notes:

• To contribute just read this file before
• Verify the changes in changelog
• Look Morris documentation to check api

Contributors

stewones	venkatramachandran	rolaveric

License

angular-morris-chart is open-sourced software licensed under MIT, maintained by @stewones. Feel free to open an issue or make a PR.