Updating graph

[edasque]

I can't just addData, I get a whole new data set of 120 points every 10 seconds.

Should the following work:

        graph.configure({series: graph_data});

        graph.render();

I don't see my graph updating and from what I can tell, my series hasn't been updated either, looking at graph.series

What am I missing? Can configure not update the series, is addData the only way but it cannot completely replace the data? is Rickshaw.Series.FixedDuration the way?

[smithclint]

I am trying to do the same thing but I haven't figured it out yet. I have been able to add/remove lines by pushing/popping from an array of series here http://jsfiddle.net/csmithmaui/pgx72/ but I am not having much luck in my acutal code.

[dchester]

We could definitely do a better job at supporting this particular use case. At the moment, you have to reach in and manipulate data attributes of the objects in graph.series directly, and then call graph.render().

[abarre]

@dchester, do you have a working example for this case?

Do we have to modify both seriesand stackedDataattributes?

I did something like that but it is not working (the graph is not updated). In the example, the graph is generated from the ajax wrapper. By the way, I see some issues saying that we have to use the addData function but there is not addData function in the series' attributes.

var 
    i,
    j,
    len = newData.length,
    len2 = graph.stackedData[0].length;

for (i= 0; i < len ; i ++) {
    graph.series[i].data = newData[i].data;
    for (j = 0; j < len2; j ++) {
        graph.stackedData[i][j] = {
            x : newData[i].data[j].x,
            y : newData[i].data[j].y,
            y0 : 0
        };
    }
}

graph.update()

[edasque]

I haven't been able to get this working by modifying the series directly or through configure.

[abarre]

Ok @edasque,

If you could share the code you use to update the graph, it would help me.

Regards,

[edasque]

I did this which worked:

        graph.series[0].data=graph_data;
        console.log("Updating graph, got new data. Most recent: "+graph_data[graph_data.length-1].y)
        graph.update();

Ideally you'd be able to modify the data with a method call of graph instead of having to access the member variable directly.

[ergo]

my fork adds support for this properly i think,

this commit in particular:

https://github.com/ergo/rickshaw/commit/d2e75b9d9f5b0fddf636f0bc71c359759e86f9e8 X, Y axes gets updated, just legend needs to be fixed.

now we need to get this to trunk :-)

[zanetaylor]

It would be great to get this in place.

[eladmoshe]

+1

[maxcal]

+1

Here is an example that worked for me to replace all series:

series = [
    {
        name: 'Sexiness',
        color: "#3064B8",
        data: data[0]
    },
    {
        name: 'Alcohol consumption',
        color: "#91B4ED",
        data: data[1]
    }
];

$(graph.series).each(function(i){
    graph.series[i] = series[i];
});

[ileathan]

20 years later I went through the above posts and nothing worked.. So I just went into my console and played with it, now this works. (Assuming graph is the variable name for your graph and series for your series data.)

      let p = graph.series.active; // preserve this 'needed' function
      series = []; // reset the data to an empty array
      setData(); // populate series with new data
      graph.series = series; // set graph data to new data
      series.active = p; // unpreserve
      graph.update(); // update

EDIT: I came back here to get this code because I redid my project, and I wanted to add that to then recreate the legend I did

  document.getElementById('legend').innerHTML = "";
  legend = new Rickshaw.Graph.Legend({
    graph: graph,
    element: document.getElementById('legend')
  });