我已经建立了一个饼图，它是一个带有客户端图像映射的图像。图像映射最初是在页面中定义的，但是坐标会通过 JavaScript DOM 操作进行更新以做一些有用的事情。为什么图像地图坐标上的 DOM 操作仅对某些浏览器有效，而其他浏览器似乎忽略了这些更改？有简单的原因和解决方法吗？可以在右下角看到饼图： http: //catza.net/en/browseall/
我已经在 Windows 7 上对此进行了测试，它适用于 Chrome 15.0 (WebKit)、Firefox 7.0 (Gecko) 和 Safari 5.1 (WebKit)。这些浏览器在扇区上显示正确的向下钻取链接到搜索引擎，并且当鼠标指针悬停在饼图上时还显示标题。Internet Explorer 8 (Trident) 和 Opera 11.52 (Presto) 似乎只是坚持初始坐标。基于这个有限的测试，图像地图坐标上的 DOM 更新适用于 Gecko 和 Webkit，但不适用于 Trident 和 Presto。欢迎更多测试结果。
以下是有关实施的一些背景信息。http://catza.net/en/browseall/的页面来源显示了图像标签<img id="viz_dist“和地图标签<map name="map_dist">。地图中已经准备好其他所有东西，但没有正确的坐标，因为它们还不知道。图表和正确的地图坐标由 Google Image Charts API 提供。更新代码http://catza.net/js_site/dist.js在$(document).ready上激活，然后处理接收到 DOM 的 JSON 数据。它涉及 coords 属性使用 JQuery attr . 源代码的重置可以在谷歌代码上找到：http ://code.google.com/p/catz/
我知道有很多可用的解决方法。我可以将坐标加载到服务器并在创建页面时正确设置它们。但这意味着在我收到来自 Google 的坐标之前无法发送页面。我可以使用较新的 Google Chart Tools，但我的测试表明我可以更快地呈现页面，尤其是在使用 Google Image Charts API 的慢速工作站上。我还可以使用 JavaScript 将 img 和 map 标签动态地创建到 DOM，但我宁愿在服务器上构建完整的页面。