我想建立一个简单的网站，上面有美国的照片。当用户将鼠标悬停在特定状态上时，我想显示一个工具提示，其中包含有关该状态的信息。
我遇到的主要问题是我希望遵守国家的界限。我不希望在状态图像上叠加隐藏的矩形，而是希望工具提示响应 每个状态轮廓 。
最合乎逻辑的方法是什么？我用于美国的图像类型（基于位图和基于矢量）？
感谢您的帮助！
答案 0 :(得分：0)
方法1 - 使用常规HTML和常规位图图像（可能是png）。使用带有工具提示的图像映射。您可以定义圆形，矩形，多边形等等。它只是简单的HTML，没有javascript，但图像是静态的。
方法2 - 使用openlayers.org并使用gpx / kml文件或类似文件定义您的区域。这看起来更漂亮，你可以缩放和平移并做各种奇特的事情，包括漂亮的HTML弹出窗口，但它需要更多的工作，包括javascript。
答案 1 :(得分：0)
您可以使用html标记来映射图像，并将每个特定的状态区域定义为具有一组点的多边形形状，以插入状态轮廓。这将是一个努力思考的地狱。
答案 2 :(得分：0)
您应该使用this solution。它已经为你做了很多。另请查看the docs。
如果你想用鼠标悬停做更好的事情，可以使用qtip2，它效果很好。
答案 3 :(得分：0)
你有任何浏览器限制吗？因为如果您使用SVG图像，您可以轻松检测哪些状态已使用javascript单击。但当然这并不是在旧浏览器中完全支持它...... !!
您可以使用Adobe illustrator制作SVG图像作为示例将图像导出为SVG，并将其作为代码使用html（您应该使用文本编辑器复制并粘贴代码来打开svg图像）他们可以定义你要点击的区域..
最好的