隠されたsvg要素でD3のイベントが発生する

Question

私はこれに対する答えを見つけることができないと私はスタンドアロンのフィドル/ペンとしてそれを再作成するには時間がかかりましたが、

私はVaadinアプリケーションで、D3を使ってsvgグラフィックスを描画したり操作したりしています。 ある時点で、画面上にはvisibility:hiddenのsvgがあります。

これは、すべてのブラウザで完全に機能します。彼らはまだ隠されているとき

これらの隠し要素が再びまだ彼らのイベントを発生するすべてのブラウザFirefoxバージョン34の隠し要素で しかしで見つける作業マウスオーバーイベント、およびをクリックして持っている（クリックするとマウスオーバー）。

よく説明すると、ボタンが隠されているときは、マウスオーバーイベントが発生してはいけません。 Firefox 34、35 beta、36 dev edition以外のすべてのブラウザで動作します。 firefox 31でうまく動作します。

私はこれがD3のバグだと思っていますが、2番目の意見が必要だったり、自分のエラーを指摘したりしていました。しかし、私は問題がそこにあると感じません。

コードを示すjsbinを作成しました.2つのオレンジ色のアイコンがあり、1つはvisibility:hiddenですあなたはそれを見るために無効にする必要があります）何も起こらないクロムで隠された要素の上にマウスを置く場合。しかし、firefox 34ではイベントが発生します。 Here's the jsBin

それはなぜ起こるのでしょうか？私は、しかし私は、これは正常な動作であることを他の地域での修正に

おかげ

Answer 1

これはFirefoxのバグです。 report it私はそれを修正します。

ポインタイベントの特定の値を指定すると、その要素がイベントを受け取るかどうかを正確に表すことができます。ポインタイベントの値がわからない場合、その要素はポインタイベントを受け取るか受け取らない可能性があります。それはすべての仕様が言っていることです。ここにあいまいさはありません。

firefoxのバグは<image>要素にのみ影響します。画像を<rect>要素に置き換えると、Firefoxでも正しい結果が表示されます。

Answer 2

spec状態を貢献する上にそれを見極めるのいずれかの私のコードを修正したいのですが、D3の問題やFirefoxのバグのいずれかを推測しています：

プロパティ‘pointer-events’の値に応じて、まだ隠さへの‘visibility’プロパティが設定されているグラフィックス要素がイベントを受け取ることがあります。あなたの周りの仕事として

はvisibility: hiddenでdisplay: noneまたはあなたのクラスにpointer-events: noneを追加するのいずれかを使用することができます。