用于响应平移/缩放的范围更新的Flot事件

对于Flot，是否有一个事件在用户使用鼠标滚轮完成平移或缩放后触发（在range.xaxis.to / from和range.yaxis.to / from已经解决之后）？ 在用户平移或放大主图后，我尝试使用下面的行更新概览图上的选择，但我发现在平移或缩放（而不是两者）之后更新到概览图。

$("#plot").bind("mouseup scroll",updateOverviewSelection); 

提前致谢。

编辑 ： http ： //jsfiddle.net/apandit/nu2rr58h/9/

在jsfiddle，我无法在主图中平移，光标似乎没有恢复正常。 用户可以在概览图中单击并拖动以进行选择，从而可以放大主图。 我还希望能够允许用户平移和放大主图，并更新概览图中的选择框; 我试图通过将updateOverviewSelection方法绑定到scroll和mouseup事件的plot div来做到这一点。 Flot中是否有事件在每次更新x轴和y轴限制时触发？

Answer 1

这个问题的解决方案如下。 问题是设置概览图的选择（ overview.setSelection(ranges); ）是触发zoom方法，因为它被绑定到概览图中的plotselected事件。 在zoom方法结束时，绘制了主图，再次调用overview.setSelection(ranges); updateOverviewSelection方法中的行。 为了防止这两个方法/事件之间的这种乒乓，我添加了一个updatingOverviewSelection标志。

http://jsfiddle.net/apandit/nu2rr58h/12/

 var datasets = [[ [0,0],[1,1],[2,2],[3,3],[4,4],[5,5],[6,6],[7,7],[8,8],[9,9] ], [ [0,0],[-1,-1],[-2,-2],[-3,-3],[-4,-4],[-5,-5],[-6,-6],[-7,-7],[-8,-8],[-9,-9] ]]; var plot = $.plot("#plot",datasets,{ pan: { interactive: true }, zoom: { interactive: true, mode: "x" } }); var overview = $.plot("#overview",datasets,{ selection: { mode: "xy" } }); var updatingOverviewSelection = false; $("#plot").bind("plotpan plotzoom",updateOverviewSelection); $("#overview").bind("plotselected", zoom); function zoom(event,ranges) { if(updatingOverviewSelection) { updatingOverviewSelection = false; } else { var options = plot.getOptions(); options.xaxes[0].min = ranges.xaxis.from; options.xaxes[0].max = ranges.xaxis.to; options.yaxes[0].min = ranges.yaxis.from; options.yaxes[0].max = ranges.yaxis.to; plot = $.plot("#plot",datasets,options); } }; // get the window x-axis and y-axis ranges for the main plot // and set the selection in the overview plot to those ranges function updateOverviewSelection(event) { var options = plot.getOptions(); var ranges = { xaxis: { from: options.xaxes[0].min, to: options.xaxes[0].max }, yaxis: { from: options.yaxes[0].min, to: options.yaxes[0].max } }; updatingOverviewSelection = true; overview.setSelection(ranges); };