Flot重置缩放

Question

我正在使用带有鼠标滚动的Flot Charts进行放大和缩小.我创建了一个按钮来调用zoomOut()并且它运行良好,但我找不到任何解决方法,我可以一直缩小,以便它看起来就像它第一次加载时一样.我不想重新加载那个容器,因为它使用ajax在刷新时从mysql中提取数据.

我用Google搜索但找不到任何东西.

Answer 1

您也可以设置双击以重置Flot图表的缩放功能.它将Flot图表重绘为其原始状态,并可与动态数据一起使用.

$("#placeholder").dblclick(function () {
plot = $.plot(placeholder, dataset, options);
});

Answer 2

您可以将轴的范围设置为空。通过设置此项，缩放级别将被设置为每个数据点都可见，就像默认缩放级别一样。

与其他解决方案不同，此解决方案不会构建全新的情节。

var axes = plot.getAxes(),
    xaxis = axes.xaxis.options,
    yaxis = axes.yaxis.options;
xaxis.min = null;
xaxis.max = null;
yaxis.min = null;
yaxis.max = null;

// Don't forget to redraw the plot
plot.setupGrid();
plot.draw();

Answer 3

您可以保存轴的初始范围并重新绘制绘图，就像导航示例一样。但你的代码将如下所示：

// do the zooming
plotObjectPointer = $.plot(placeholder, plotData,
    $.extend(true, {}, options, {
        xaxis: { min: ranges.xaxis.from, max: ranges.xaxis.to },
        yaxis: { min: ranges.yaxis.from, max: ranges.yaxis.to }
    }));

其中范围将是您的初始范围。为了防止重复 Ajax 加载，您可以使用 window.localStorage 或另一个 var 来存储plotData。