CODEWITHSUNDEEP
javascriptjqueryjqplot
Hkachhia
Hkachhia

Reputation: 4539

Dynamically pass series in jqplot line chart

I have used jqplot line chart. I have get data from php page using ajax.In some condition I will display specific series.So

How to pass series dynamically in jqplot line chart and also set legend of series ?

I have manually write code for above requirement.I have apply click event on legend series and draw graph as per click on legend.

I have also change y-axis value as per select/deselect series legend.

Upvotes: 3

Views: 6423

Answers (3)

Josef Meier
Josef Meier

Reputation: 11

I had the same problem recently. "replot" works but is veeerrryyy slow. I used "jQPlot.drawSeries" which is blazingly fast. Just give your new series data to jQPlot as usual and call jQPlot.drawSeries({}, <nr of your series from 0...xxx)

My realtime chart with 800 values runs with >> 60 FPS on my PC and also very fast on my mobiles.

Upvotes: 0

dmccabe
dmccabe

Reputation: 1034

I originally tried the answer posted by @sdespont, but due to additional properties that need to be in place for the series, it wasn't working properly. I was able to get this working by doing the following:

plot1.data = data;
plot1.replot( data );

data is a 3D array of the same makeup as you would pass in when creating the plot. If I did either part without doing the other, it wouldn't refresh properly, but the combination of the two seems to do the trick. Refreshing the plot in this fashion would dynamically add or remove any series I added to the data array.

Hope that helps.

Upvotes: 1

sdespont
sdespont

Reputation: 14025

You could add or remove series by playing with plot1.series array.

Here is a good jsfiddle : jsfiddle.net/fracu/HrZcj

The idea is to create an array with data

    myNewSerie = Array();
    x = (new Date()).getTime();
    y = Math.floor(Math.random() * 100);
    myNewSerie.push([x, y]);

Then add it to the graph using the next available slot

plot1.series[plot1.series.length] = myNewSerie

And finally redraw using plot1.replot();

Check out the updateSeries function in the end of the fiddle

Not tested, but should work

Upvotes: 0

Related Questions