ember-cli-rickshaw

Ember-rickshaw

Ember implementation for rickshaw

Timeseries graphs done right in Rickshaw

Installation

• npm install ember-cli-rickshaw
• bower install rickshaw

Git repo

https://github.com/Ahamtech/ember/

Ember Hover

{{#ember-rickshaw type="lineplot" height="600" width="1300" data=model hover=true}}

Ember Hover

{{#ember-rickshaw type="lineplot" height="600" width="1300" data=model hover=true}}

{{#ember-rickshaw type="lineplot" height="600" width="1300" data=model hover=true hover-option=options}}

    options: {formatter: function(series, x, y) {
        var date = '<span class="date">' + new Date(x * 1000).toUTCString() + '</span>';
        var swatch = '<span class="detail_swatch" style="background-color: ' + series.color + '"></span>';
        var content = swatch + series.name + ": " + parseInt(y) + '<br>' + date;
        return content;
    }}

Ember Slider

{{#ember-rickshaw type="lineplot" height="600" width="1300" data=model hover=true slider=true slider-element="ember-slider"}}
<div id="ember-slider"></div>

Ember Axis Time

{{#ember-rickshaw type="lineplot" height="600" width="1300" data=model hover=true axistime=true }}

Ember Legend

{{#ember-rickshaw type="lineplot" height="600" width="1300" data=model hover=true legend=true legend-element="legend" legend-highlight=true}}
<div class="column" id="legend"></div>

Ember Annotator

{{#ember-rickshaw type="lineplot" height="600" width="1300" data=model hover=true axistime=true hover-option=hoverformatter annotator=true annotator-element="annotator" annotator-data=annatator}}
 
<div id="annotator"></div>

TODO

Better Documentation

Support for Multi Axis representation

Better start up code snipperts

Demo App

Adding into NPM repo

License

Ember Rickshaw is Copyright © 2016 Ahamtech. It is free software, and may be redistributed under the terms specified in the LICENSE file.

About Ahamtech

Ember-Rickshaw is maintained by Ahamtech.

We love open source software, Erlang, Elixir, and Phoenix. See our other opensource projects, or hire our Elixir Phoenix development team to design, develop, and grow your product.