Javascript 如何在Flot中停用选择并激活缩放/平移？

我可以使用选择插件选择我的绘图区域并放大

现在我想能够在选择缩放和鼠标滚轮缩放+平移之间切换

作为测试，我想在选择和放大某个对象后立即禁用选择，同时使用鼠标滚轮激活平移和缩放

我可以使用

getOptions（）

设置选项，但无法更改选择/缩放/平移。我检查options对象，它确实发生了变化（

interactive=true

）。我用

draw（）

重新绘制了绘图，但选择/缩放/平移没有改变

代码将允许我选择和缩放，但仅此而已：

$("#chart1").bind("plotselected", function (event, ranges) {
    var o=plot.getOptions();
    o.xaxes[0].min = ranges.xaxis.from;
    o.xaxes[0].max = ranges.xaxis.to;
    o.yaxes[0].min = ranges.yaxis.from;
    o.yaxes[0].max = ranges.yaxis.to;
    // block 1: not working as expected, although the options object does change                                                                                                                                                                     
    o.pan.interactive = true;
    o.zoom.interactive = true;
    o.selection.mode = null;
    // block1 end                                                                                                                                                                                
    plot.setupGrid();
    plot.draw();
    plot.clearSelection();
}

---

我做错了什么？

我不知道如何解决这个问题，所以我决定同时保留

zoom.interactive=true

和

selection.mode=“xy”

对于平移，我在绘图的一侧添加了4个按钮（如导航插件示例中的箭头）。尽管用鼠标平移确实很酷，但无论如何用户都必须在模式之间切换（缩放+平移或选择缩放）

---

虽然这不是我问题的答案，但如果其他人正在寻找一种进行选择/缩放/平移的方法，这个解决方案会起作用。

为了在Flot 0.8.2中实现这一点，我对这两个插件做了一个小的修改

在jquery.flot.navigate.js的

函数onDragStart（e）

中，更改

if (e.which != 1)  // only accept left-click

if (e.which != 1)  // only accept left-click

到

在jquery.flot.selection.js的mousedown（e）函数中，更改

if (e.which != 1)  // only accept left-click

if (e.which != 1)  // only accept left-click

到

在启用这两个选项的情况下初始化绘图，否则将不会为禁用的选项绑定事件处理程序。然后禁用其中一个选项

var plot = $.plot ($("#chart1"), data, {selection:{mode:"xy"}, pan:{interactive:true}});
plot.getOptions().selection.mode = null;

如果我修改了Flot代码以绑定和解除绑定事件处理程序，那会更好，但这更简单。

我找到了一个好的解决方案： 使用当前数据和选项再次绘制绘图

plot = $.plot("#flotplaceholder",data, options);

//更改选项以启用/禁用平移/选择

            var theOptions = plot.getOptions();
            if (actionMode == "pan"){
                theOptions.pan.interactive = true;
                theOptions.selection.mode = null;
            }else if(actionMode == "select"){
                theOptions.pan.interactive = false;
                theOptions.selection.mode = "xy";
            }

//重画情节

plot = $.plot("#flotplaceholder", plot.getData(), theOptions);

---

希望对您有所帮助

感谢您分享此解决方案！很抱歉，我花了这么长时间回复，我正在做其他项目，但忘记了这个项目。我试过你的解决办法，但对我无效。只有平移有反应，但效果不好。您不也应该激活绘图选项中的缩放吗？否则，如何缩放？是的，您需要添加

zoom.interactive=true

。我忽略了这一点，而专注于棘手的部分：在平移和选择之间切换。缩放应该很简单。如果你看一下日期，另一个答案是在2014年1月发布的，我在2013年10月发布了这个答案，几个月前。。。