4

我已经用 jQuery flot 实现了一些缩放功能，但它工作得并不完全正确。缩放是通过捕获 flot 的“plotselected”事件并使用“ranges”参数重新绘制来修改 xaxis 和 yaxis 最大值和最小值来实现的。

该图在最初绘制时确实显示正确，我可以拖动以进行 xy 选择。重新绘制绘图时，屏幕上轴网格的实际大小会缩小，但会绘制适当的数据范围。此外，每次缩放重新绘制时，轴标签都会从视图中消失，尽管我仍然可以在检查器中看到它们，并且在图的最左上角有一些看起来像轴标签可能已经向上移动的杂物那里并且部分（几乎）可见。我有一些其他代码可以使用不同的数据重新绘制绘图，这些数据也会从视图中删除轴标签，尽管绘图的大小不会缩小（就像缩放时那样），并且再次绘制了适当的数据。我提到这两个问题可能有共同的起源。

我想也许我可以通过在重新绘制之前以某种方式破坏情节或清除画布来解决这些问题，但我还没有找到任何关于如何做到这一点的指导。

以下是一些相关的代码片段。第一个列出了最初渲染绘图并绑定到“plotselected”事件的代码：

            o.midGraph = $.plot($("#small-graph-mid"), testData, graphOptions);
                $("#small-graph-mid").unbind("plotselected");
                $("#small-graph-mid").bind("plotselected", function (event, ranges) {
                    graphOptions = o.midGraph.getOptions();
                    testData = o.midGraph.getData();
                    o.midGraph = $.plot($("#small-graph-mid"), testData,
                            self._graphZoomOptions(graphOptions, ranges));
                });

这是将轴范围设置为新范围的函数：

    _graphZoomOptions: function(options, ranges) {
        return $.extend(true, {}, options, {
            xaxis: { min: ranges.xaxis.from, max: ranges.xaxis.to },
            yaxis: { min: ranges.yaxis.from, max: ranges.yaxis.to }
        });
    },

我认为我需要以某种方式破坏/清除/重置情节/画布是否走在正确的轨道上？

4

3 回答 3

5

您使用的是 jquery 1.7.2 吗？

如果是这样，请查看此线程，尤其是注释 #4 中包含的固定导航插件。

经过数小时的混乱，它解决了我使用导航插件的问题。

于 2012-05-26T19:42:57.083 回答
1

我遇到了这个问题，通过不使用 plot.getOptions() 解决了它。没有考虑到这个原因，但使用我在启动情节时创建的原始选项对象有效。

于 2013-05-16T10:54:51.763 回答
1

以下是我将 Y 轴设置为某个范围的方法。之后所有 Y 轴都将设置为相同的范围。“每个”循环中的 4 条语句中有 2 条可能是不必要的，我只是不记得哪些。

$.each(yaxes, function(_, _yaxis){
    _yaxis.min = _min;
    _yaxis.max = _max;
    _yaxis.options.min=_min;
    _yaxis.options.max=_max;
});

setupGrid();
draw();

您不需要销毁图表并重新绘制它。setupGrid 和 draw 函数会为您处理该部分。

于 2012-07-23T13:58:10.590 回答