Skip to content

How to use Rickshaw.Series.FixedDuration? #27

Description

@mustafaakin

I want a real-time graph. But the example given in the examples just add data. I know I can just add and shift data on my own. But, the example here is much more cleaner: http://code.shutterstock.com/rickshaw/examples/fixed.html

The code for that is following: How can I achieve it with angular-rickshaw?

var tv = 250;

// instantiate our graph!
var graph = new Rickshaw.Graph( {
    element: document.getElementById("chart"),
    width: 900,
    height: 500,
    renderer: 'line',
    series: new Rickshaw.Series.FixedDuration([{ name: 'one' }], undefined, {
        timeInterval: tv,
        maxDataPoints: 100,
        timeBase: new Date().getTime() / 1000
    }) 
} );

graph.render();

// add some data every so often

var i = 0;
var iv = setInterval( function() {

    var data = { one: Math.floor(Math.random() * 40) + 120 };

    var randInt = Math.floor(Math.random()*100);
    data.two = (Math.sin(i++ / 40) + 4) * (randInt + 400);
    data.three = randInt + 300;

    graph.series.addData(data);
    graph.render();

}, tv );

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions