Raphael JS：mouseover/mouseout - 文本標籤問題

Question

我使用Raphael JS創建一個帶有區域和文本標籤的SVG地圖。當您將鼠標移動到該區域上時，我希望該區域突出顯示。

我現在有這個工作，但是當我將鼠標移動到標籤上（在該區域的中心）時，該區域的鼠標事件被觸發，所以該區域再次不被注意。

有沒有什麼辦法可以防止這種情況發生或解決方法？

Answer 1

在文本上創建一個不透明度設置爲0的矩形，並在該矩形上附加事件處理程序。您可以使用文本的getBBox()來計算矩形的尺寸。

Answer 2

通過Paper#set創建一個集合是我工作的方法。例如：

var st = paper.set(); 

st.push.apply(st, vectors); // `vectors`: my array of "hoverable" vectors 
st.push(text);    // `text`: my text vector for `vectors` 

st.hover(function() { 
    text.show(); 
}, function() { 
    text.hide(); 
});