Add/Remove series data

[mzupan]

I'm looking to make a chart generator and I have no idea what type of data they will graph. I'm wondering if there is a way to add remove series data from a graph without a refresh or anything. So the line and item in the legend will just show up when there is a new series data added to the array.

I tried to just add it to like graph.series array but it never updated to reflect it.

[mzupan]

ok seems like it works.. it was an issue in the code.. only thing that doesn't update is the legend it seems when you append a new series to a graph

[gsejourne]

@mzupan: I'd be interested to know how you achieved this...

I'm trying to do the same thing, and am stuck when I try to update the graph.series.

Here's a sample of code of what I'm trying to do:

var newSerie = {
        color : palette.color(),
        data  : data,
        name  : title
    };
graph.series.push(serie);

graph.validateSeries(graph.series);
graph.update();

These two last calls always throw errors...

I saw that the data is contained multiple times in the graph object:

• graph.series[x].data
• graph.stackedData

which makes me think I might not be updating the right one...

Any help would be appreciated...

Thanks,

[mzupan]

@gsejourne

see the following jsfiddle

http://jsfiddle.net/tWXzL/1/

[radiodario]

Yes but is it possible to start the chart without data, i.e. a 'chart skeleton', and add the data later?

[gsejourne]

@radiodario

From what I tried, not out of the box no.

You gotta play a bit with the configuration: for instance, you must instantiate the legend, etc. once the data is there.

So the "blank" skeleton configuration will be limited to the minimum.

[radiodario]

Thanks a bunch! - is there an example?

[Sephi-Chan]

Using a slightly modified version of the jsfiddle, I display a legend box. The problem is that the legend is not dynamicaly updated when I add a serie.

http://jsfiddle.net/tWXzL/61/

Any idea?

[rouge8]

I handle this by emptying the legend element and creating a new legend:

$('#legend_container').empty();
legend = new Rickshaw.Graph.Legend({
    graph: graph,
    element: document.getElementById('legend_container')
});

I add this to the button's click handler: http://jsfiddle.net/tWXzL/62/

[mpderbec]

This issue should be properly fixed by pull request https://github.com/shutterstock/rickshaw/pull/266.

[adampl]

Why not just call legend.render()? :)

[ceremcem]

None of the fiddles work at the moment.