Question

我按照Raphaël网站上的演示制作了这个map。我希望每个形状（département）都可以点击并导向页面。例如，我把一个链接放在黄色的形状上，或多或少在地图的中心。

这是怎么回事：
没有点击，形状看起来很棒，我点击它，它引领页面，完美！我点击浏览器上的上一个箭头返回并再次悬停相同的形状，它表现得非常奇怪。笔画似乎破碎或形状在其他笔画下面（details here）。你知道发生了什么吗？

此外，我想就您对地图的体验（可用性和浏览器兼容性（IE？））提出您的意见和反馈。

提前感谢您的帮助。

Answer 1

它看起来很奇怪的原因是因为通过添加元素的链接，Raphael将<path>元素（定义了部分形状）包裹在<a href="">内。但是它的toFront()方法仍适用于<path>，因此现在只需将其推到<a>的前面，而不是整个前部的前面。换句话说，.toFront()不再有用了。

实际上，这看起来像拉斐尔的一个错误。我不确定如何修复它，除了用检查节点是否有.toFront()父项的函数替换你正在使用的<a>的每一次出现，如果是，则移动到前面（通过将其重新插入DOM）。

此外，

它以不同的方式在IE中被打破。

我认为制作该演示的人已经知道了，因为if(current)中的mouseover块在澳大利亚示例中修复了它。但是你添加的缩放和描边宽度动画基本上也需要在那里重置。

如果您用以下内容替换if(current)块，它应该可以工作：

if (current && current != departement) {
    fra[current].animate({
        fill: "#333",
        stroke: "#666",
        "stroke-width": 1
    }, 500);
    fra[current].scale(1,1)
    document.getElementById(current).style.display = "";
}

一旦点击，笔划就会破碎或形成在其他人之下--Raphael.js

1 个答案:

此外，