我想创建一个交互式地图，用户可以在地图上点击不同的省份得到具体到该省信息。
例如： http://www.todospelaeducacao.org.br/ http://code.google.com/p/svg2imap/
到目前为止，我只发现功能有限的解决方案。 我只真正搜寻此使用SVG文件，但如果有可能，我会开放给其他文件类型。
如果有人充分运作的方式知道这样做（jQuery插件，PHP脚本，矢量图像）或如何做手工请你分享的教程。
Answer 1:
jQuery插件用于装饰影像地图（亮点，选择区域，提示）：
http://www.outsharked.com/imagemapster/
披露：我写的。
Answer 2:
听起来像是你想要一个简单的图像映射，我建议你不要让它更复杂更比它需要。 这里有一篇文章如何提高与SVG图像映射 。 这很容易在SVG本身做的点击区域，只是周围添加你想拥有可点击的形状有些<a>元。
一对夫妇的选择，如果你需要的东西更先进：
- http://jqvmap.com/
- http://jvectormap.com/
- http://polymaps.org/
Answer 3:
我认为这是更好地我的答案分为2个部分：
从头开始-创建一切（SVG使用，JavaScript和HTML5）：
- 创建一个新的HTML5网页
- 创建一个新的SVG文件，每个可点击区域（省）应该是一个独立的SVG多边形在SVG文件，（我使用Adobe Illustrator创建SVG文件，但你也可以找到许多替代的软件产品，比如Inkscape中 ）
- 通过一个鼠标悬停添加，然后单击事件到你的一个多边形
<polygon points="200,10 250,190 160,210" style="fill:lime;stroke:purple;stroke-width:1" onmouseover="mouseOverHandler(evt)" onclick="clickHandler(evt)" /> - 添加每个事件的处理程序在你的JavaScript代码，并添加所需的代码来处理程序
function mouseOverHandler(evt) {}; function clickHandler(evt) {}; - SVG文件添加到您的HTML页面（我喜欢联SVG，但你可以使用链接SVG文件太）
- 将文件上传到服务器
乙 -使用像一个软件FLDraw交互式图像创建 （仅当你有一个地图图像，并希望把它互动）：
- 创建一个空的项目，并创建新的项目时，选择你的地图图像为基础映像
- 新增多边形元素（从形状菜单），每个省
- 对于每个多边形双击它打开属性窗口，在这里你可以选择一个事件类型的鼠标悬停和点击，也改变了形状，不透明度为0，使其不可见
- 保存项目，并将其发布到HTML5，FLDraw将创建一个包含所有项目所需要的文件，您可以上传到你的服务器的一个新的文件夹。
选项（A）是非常好的，如果你是程序员或者你有别人创建所需的代码和SVG文件给你，选项（B）是好的，如果你不想雇人或花自己的时间，从创建的一切刮
你有一些其他的选择也是如此，例如使用HTML5画布，而不是SVG，但它不是很容易的创建一个使用HTML5画布，也许还有一些其他的方法太，我是不知道的可缩放地图。
Answer 4:
万一有人会寻找它 - 我用它在几个网站，总是定制和RD的可能性是我需要的东西一个完美的结合。 简单，它是免费使用：
可点击CSS地图
对于网站上的多个脚本一注：我有一些恼人的问题，自己动手地图，许多其它脚本使用在Drupal 7（即从事平面菜单）在那里，并处理它们后，我被困与地图 - 它仍然没有工作，虽然jquery.cssmap.js，CSS（本地），并在正确的地方，其中的脚本。 萤火虫给我的错误，我突然灵光 - 一个简单的疏忽，我离开了脚本代码，因为它是在例子，有冲突。 只要改变前面函数“$”到“jQuery的”（或其他处理器）和它的作品完美。 ：]
这是我精神疾病（当然你也可以把它之前，而不是）：
<script type="text/javascript"> jQuery(function($){ $('#map-country').cssMap({'size' : 810}); }); </script> Answer 5:
转到SVG脚本与SVG默认输出为SVG编码的地图，增加了事件也被添加，但很容易识别，并且可以根据需要改变。
Answer 6:
我一直在使用makeaclickablemap现在我省的地图有一段时间了，它原来是一个非常不错的选择。
Answer 7:
我有同样的要求，最后这个地图转换为我工作。 这是任何地图生成最佳的插件。
Answer 8:
下面的代码可以帮助你：
$("#svgEuropa [id='stallwanger.it.dev_shape_DEU']").on("click",function(){
alert($(this).attr("id"));
});
资源
Answer 9:
这里是另一个影像地图插件，我写来增强图像映射： https://github.com/gestixi/pictarea
它可以很容易地突出显示所有区域，让你指定视区的状态不同的风格：正常，悬停，主动，禁用。
您还可以指定有多少区域可以在同一时间进行选择。
Answer 10:
您有这好几个选项：
1 -如果你可以找到你想要的，你可以使用类似图中的SVG文件RaphaelJS或SnapSVG添加点击监听器为您的国家/地区，该解决方案是最可定制的......
2 -您可以使用专用工具，如clickablemapbuilder（免费）或makeaclickablemap（我认为自由也） 。
【免责声明】IM的作者clickablemapbuilder.com :)
Answer 11:
<script type="text/javascript"> jQuery(function($){ $('#map-country').cssMap({'size' : 810}); }); </script> 文强
文章来源: Create a map with clickable provinces/states using SVG, HTML/CSS, ImageMap
