2012-02-27 5 views
0

を離れたとき、私もFLOTメインの例のページ上で再生することができ、次の問題、hoverableドーナツグラフは、マウスがチャート

を持つことだし、それを克服するためにどのような方法があります場合、私は思っていたハイライトを失うことはありません。

問題の説明:ドーナツチャートを設定し、grid: { hoverable: true }を使用しています。

次のものは、一部のdivの中にチャートを配置しているため、ドーナツチャートの上下のバウンダがdiv境界線にほとんど触れるようになっています。今、ドーナツスライスを強調表示していますが、 FAST離れチャートからI「スライド」マウス強調表示スライスが損失がその

(悪い見えた)...ハイライトされていない場合ちょうど(下の例に行くここFlot Pie Examples

で再現することができますドーナツ)、マウスを下側または上側のスライスの上に置き、マウスですばやく離します。スライスがまだ強調表示されていることに注意してください。

(mouseleaveイベントを使用して)マウスがチャートコンテナから離れるときはわかりますが、どうすればハイライトを削除できますか?

ありがとうございます!

答えて

2

悲しいことに、悲しいことに、パイプラグインでは、ハイライトを解除できる方法が公開されていません。一般的にはプラグインがよりsanely書かれていた場合、あなたはあなたのプレースホルダの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をあなたがパイの一部ではないと確信しているものに設定します。そして、これはその場所でmoveイベントを生成し、パイは自分自身のハイライトを解除します。あなたもクリックイベントを設定している場合は、あなただけのclickmousemoveを変更(も同じ場所でクリックイベントを生成する必要があるかもしれません

がここにアクションでそれを参照してください。http://jsfiddle.net/ryleyb/9LdKg/

+0

偉大な回避策を感謝Ryley! – Daniel