如何在使用AJAX更新时保存(保留)flot图的缩放状态

如何在使用AJAX更新时保存(保留)flot图的缩放状态,ajax,javascript,flot,zooming,Ajax,Javascript,Flot,Zooming,我有一个简单的应用程序,它每分钟轮询数据库中的数据。获取新数据时,我使用ajax更新图形。但是,每当我更新图形时(使用添加到绘图数据中的新值重新绘图),当前的缩放状态将丢失。在更新图形之前,我希望保留最新的缩放位置。更新图形后,我想将图形缩放到其保存的位置。这一点很重要,因为每分钟重新缩放都很烦人。这可能吗?以下是约书亚·瓦尔纳的答案 在重新打印之前获取新数据时,获取当前缩放和 将其添加到更新时的选项中 // Get the current zoom var zoom = plot.getAxe

我有一个简单的应用程序,它每分钟轮询数据库中的数据。获取新数据时,我使用ajax更新图形。但是,每当我更新图形时(使用添加到绘图数据中的新值重新绘图),当前的缩放状态将丢失。在更新图形之前,我希望保留最新的缩放位置。更新图形后,我想将图形缩放到其保存的位置。这一点很重要,因为每分钟重新缩放都很烦人。这可能吗?

以下是约书亚·瓦尔纳的答案 在重新打印之前获取新数据时,获取当前缩放和 将其添加到更新时的选项中

// Get the current zoom
var zoom = plot.getAxes();

// Add the zoom to standard options
var zoomed = {};
$.extend(zoomed,options);
zoomed.xaxis.min = zoom.xaxis.min;
zoomed.xaxis.max = zoom.xaxis.max;
zoomed.yaxis.min = zoom.yaxis.min;
zoomed.yaxis.max = zoom.yaxis.max;

// draw/save the plot
plot = $.plot($("#graph"), d, zoomed);

我从Ozan那里尝试了这个答案,但我无法获得复制缩放的块,所以我只使用plot.getOptions()来绘制图形。 像这样:

var oldOptions = plot.getOptions();
plot = $.plot($("#graph"), data, oldOptions);

通过这种方式,您可以动态更改视图,并且自动更新将在不更改视图的情况下更新。

您应该获得有关当前轴状态的信息,将其与初始选项合并,然后将其提供给新绘图

// Deep copy of the options object so that we can keep it unchanged
// for when we don't want to preserve the zoom.
var copyOptions = $.extend(true, {}, options);

if (plot != null && preserveZoom) {
    // There might be more than one Y axis
    var zoomY = plot.getYAxes();

    for (var i = 0; i < zoomY.length; i++) {
        copyOptions.yaxes[i].min = zoomY[i].min;
        copyOptions.yaxes[i].max = zoomY[i].max;
    }

    // Considering only one X axis, in case of more than one
    // you should use the same method as for the Y axis.
    copyOptions.xaxis.min = plot.getXAxes()[0].min;
    copyOptions.xaxis.max = plot.getXAxes()[0].max;
}

plot = $.plot("#placeholder", data, copyOptions);
//options对象的深度副本,以便我们可以保持它不变
//当我们不想保留缩放时。
var copyOptions=$.extend(true,{},options);
if(plot!=null&&preserveZoom){
//可能有多个Y轴
var zoomY=plot.getYAxes();
对于(变量i=0;i
这对我来说也更有效。这也处理平移和缩放。。。