reuse jqplot object to load or replot data

问题

I am using JqPlot for charts , my problem is i want to load different data on different click events.

But once the chart is created and loaded with the data for the first time; i don't know then how to load data when another event fires that means i want to reuse the chart object and want to load/replot the data when events get fired something like...

chartObj.data = [graphData]

回答1:

That seems to work to replot data.

chartObj.series[0].data = [[0, 4], [1, 7], [2, 3]];
chartObj.replot();

Also, you can check this: https://groups.google.com/group/jqplot-users/browse_thread/thread/59df82899617242b/77fe0972f88aef6d%3Fq%3D%2522Groups.%2BCom%2522%2377fe0972f88aef6d&ei=iGwTS6eaOpW8Qpmqic0O&sa=t&ct=res&cd=71&source=groups&usg=AFQjCNHotAa6Z5CIi_-BGTHr_k766ZXXLQ?hl=en, hope it helps.

回答2:

Though this is an old question.

As the accepted Answer didn't work for me and i couldn't find a solution in the jqPlot docs either. I came to this solution

var series = [[1,2],[2,3]];
chartObj.replot({data:series});

Src: Taking a look at the replot function.

function (am) {
    var an = am || {};
    var ap = an.data || null;
    var al = (an.clear === false) ? false : true;
    var ao = an.resetAxes || false;
    delete an.data;
    delete an.clear;
    delete an.resetAxes;
    this.target.trigger("jqplotPreReplot");
    if (al) {
        this.destroy()
    }
    if (ap || !L.isEmptyObject(an)) {
        this.reInitialize(ap, an)
    } else {
        this.quickInit()
    } if (ao) {
        this.resetAxesScale(ao, an.axes)
    }
    this.draw();
    this.target.trigger("jqplotPostReplot")
}

The line if (ap || !L.isEmptyObject(an)) { this.reInitialize(ap, an) }
shows us it needs a truthy value for ap to pass it as first parameter to the internal reinitialize function. which is defined as var ap = an.data || null;

Its as simple as this but unfortunately not documented anywhere i could find it

Note that if you want to redraw some things defined in your jqPlot options, like legend labels, you can just pass any option to the replot function. Just remember the actual series to replot has to be named "data"

var options = {
     series : [{
            label: 'Replotted Series',
            linePattern: 'dashed'
     }],
   //^^^ The options for the plot
     data : [[1,2],[2,3]]
   //^^^ The actual series which should get reploted
}
chartObj.replot (options)

回答3:

jqplot allows for a fast dynamic data update.

According to the documentation (data section), "Data should NOT be specified in the options object ..." (fiddle)

plot1.replot({data: [storedData]}); // data should not be passed this way

"... but be passed in as the second argument to the $.jqplot() function."

if (plot1) plot1.destroy();
plot1 = $.jqplot('chart1', [storedData]); // similar speed to replot

The fiddle shows this can be done with similar performance.

回答4:

Empty graph div, before rendering the graph

$('#graphDiv').empty();
plot = $.jqplot('graphDiv', [graphValues], graphOptions);

回答5:

The API has a replot/redraw method

Redraw This enables plot data and properties to be changed and then to comletely clear the plot and redraw.

来源：https://stackoverflow.com/questions/4520451/reuse-jqplot-object-to-load-or-replot-data

标签

javascript

jquery

jqplot