label - Raphael JS：鼠标悬停/鼠标移出 - 文本标签问题

Question

我使用 Raphael JS 创建带有区域和文本标签的 SVG 地图。当您将鼠标移到该区域上时，我希望该区域突出显示。

我现在有这个工作，但是当我将鼠标移动到标签上（在区域的中心）时，该区域的 mouseout 事件被触发，因此该区域再次未突出显示。

有什么办法可以防止这种情况发生，或者解决方法？

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();
});