Question

我有以下问题，甚至可以在Flot主要示例页面上重现，

我想知道是否有办法克服它。

问题描述：设置圆环图并在其上使用grid: { hoverable: true }。

接下来的事情是将图表放在某个div中，这样圆环图的上下边缘几乎触及div边界，现在......当我将圆环切片时，它们被突出显示，但是......如果我将鼠标“快速滑动”远离图表，突出显示的切片不会丢失其突出显示的...（看起来很糟糕）

可以在这里复制Flot Pie Examples

转到下面的示例（Donut），将鼠标放在下部或上部切片上并用鼠标快速离开，注意切片仍然突出显示

我可以告诉鼠标何时离开图表容器（使用mouseleave事件）但是我怎样才能摆脱突出显示？

提前致谢！

Answer 1

嗯，遗憾的是，插件插件不会暴露任何让你不亮的方法。一般来说，如果插件写得更加清晰，你可以在占位符div的mouseleave上调用plot.unhighlight() ......但这不是一个完美的世界，所以相反你必须做一些令人讨厌的事情：

$("#interactive").mouseleave(function() {
    var e = jQuery.Event('mousemove');
    e.pageX = 1;
    e.pageY = 1;
    $('#interactive canvas:first').trigger(e);
});

你将pageX和pageY设置为你肯定永远不会成为馅饼的一部分然后在这个位置产生一个移动事件，它会使馅饼变为不突出显示本身。如果您还设置了点击事件，则可能还需要在同一位置生成点击事件（只需将mousemove更改为click。

在此处查看此行动：http://jsfiddle.net/ryleyb/9LdKg/

当鼠标离开图表时，可收起的圆环图不会丢失亮点

1 个答案: