ラファエロ要素の選択問題

Question

これはRaphaelの専門家にとっては簡単な質問です。

ユーザーが各国をクリックして詳細を表示できるルートマップを作成しました。赤い線の上にマウスを置くと、mouseoutイベントがトリガされる点を除いて、正常に動作します。私は事実上マップ上の単なるイメージであり、インタラクティブな要素ではないために赤い線が必要です。これをどのように達成するのですか？ http://www.martyn-roberts.co.uk/cycleafrica/route

ありがとう：

は、アクションのマップを参照してください！

Answer 1

赤い線の上に目に見えないレイヤーを作成すると、地図上でアニメーションがトリガーされます。

Answer 2

この回答は1年4分前にとてもエレガントだったでしょう... SVGのpointer-events propertyを使用して、Raphaelを直接経由することはありませんが、これを達成する非常に簡単な方法があります。あなたがする必要があるのは、あなたのルートパスに関連付けられたノードを、ポインタイベント：なしでスタイルすることだけです。 JavaScriptとjqueryのを使用して、それは

$(routePath.node).css('pointer-events', 'none'); 

になりそれとも直接JavaScriptを使用して：ルートの背後にある要素に「ドロップ」するために、すべてのマウスイベントを強制します

routePath.node.style.pointerEvents = 'none'; 

。

ここにはuse of pointer events with circles and pathsを示すフィドルがあります。