重用jqplot对象来加载或重新绘制数据

时间:2022-09-15 10:53:16

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

我正在使用JqPlot图表,我的问题是我想在不同的点击事件上加载不同的数据。

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]

5 个解决方案

#1


19  

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.

此外,您可以查看以下内容: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,希望它有所帮助。

#2


17  

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

由于接受的答案对我不起作用,我也无法在jqPlot文档中找到解决方案。我来到这个解决方案

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

Src: Taking a look at the replot function.

Src:看一下replot函数。

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;

行if(ap ||!L.isEmptyObject(an)){this.reInitialize(ap,an)}向我们展示了它需要一个真值才能将ap作为第一个参数传递给内部重新初始化函数。其定义为var ap = an.data ||空值;

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"

请注意,如果要重新绘制jqPlot选项中定义的某些内容,例如图例标签,则可以将任何选项传递给重绘图函数。只记得重新绘制的实际系列必须命名为“数据”

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


2  

jqplot allows for a fast dynamic data update.

jqplot允许快速动态数据更新。

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."

“...但是作为$ .jqplot()函数的第二个参数传入。”

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

The fiddle shows this can be done with similar performance.

小提琴表明这可以通过类似的表现来完成。

#4


1  

Empty graph div, before rendering the graph

在渲染图形之前,空图形div

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

#5


0  

The API has a replot/redraw method

API具有重新绘制/重绘方法

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

重绘这样可以更改绘图数据和属性,然后完全清除绘图和重绘。

#1


19  

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.

此外,您可以查看以下内容: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,希望它有所帮助。

#2


17  

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

由于接受的答案对我不起作用,我也无法在jqPlot文档中找到解决方案。我来到这个解决方案

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

Src: Taking a look at the replot function.

Src:看一下replot函数。

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;

行if(ap ||!L.isEmptyObject(an)){this.reInitialize(ap,an)}向我们展示了它需要一个真值才能将ap作为第一个参数传递给内部重新初始化函数。其定义为var ap = an.data ||空值;

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"

请注意,如果要重新绘制jqPlot选项中定义的某些内容,例如图例标签,则可以将任何选项传递给重绘图函数。只记得重新绘制的实际系列必须命名为“数据”

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


2  

jqplot allows for a fast dynamic data update.

jqplot允许快速动态数据更新。

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."

“...但是作为$ .jqplot()函数的第二个参数传入。”

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

The fiddle shows this can be done with similar performance.

小提琴表明这可以通过类似的表现来完成。

#4


1  

Empty graph div, before rendering the graph

在渲染图形之前,空图形div

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

#5


0  

The API has a replot/redraw method

API具有重新绘制/重绘方法

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

重绘这样可以更改绘图数据和属性,然后完全清除绘图和重绘。