自定义jQuery Interactive SVG Map插件

Question

背景 - 我正在为一小群酒店工作。他们当前的网站有一个图像地图，上面有标记，指向每个位置。问题是图标太大而且正在建造太多的新酒店，以这种方式继续这样做是不切实际的。没有空间。

我的解决方案 - 我在Codecanyon.com上找到了jQuery Interactive SVG Map插件，它的效果非常好。我可以指出位置，添加标记，地图有这么多功能，它几乎是完美的解决方案。 http://codecanyon.net/item/jquery-interactive-svg-map-plugin/1694201

问题 - 虽然地图已经做了很多，但它并没有做我需要的一切。这是我想要完成的一个简短列表：

1. 单击状态会使视图框中的状态居中，并放大到最大值

听起来很容易，对吗？该插件有一个“setViewBox”方法，它可以设置默认的视图框，如果我将它命名为onClick，我可以让它做我想要的，放大和居中状态。然而，这是正在发生的事情：

1. 跳转到更近的视图框不会自动缩放标记，这对于消除网站当前面临的混乱问题是必要的。此外，它不会影响地图的“缩放”级别。说我可以从1-5放大。我点击一个状态，看起来好像我跳到了缩放5，但是当我从1开始缩放它时，我可以放大比我想象的更远的方式而不是缩小。我希望我不要混淆。
2. 平移有类似的情况。如果我像我一样更改视图框以获得所需的结果，单击并按住以平移突然将地图拉出位置，就像光标认为我在其他地方单击一样。

我很想给你一些代码示例，但我不知道从哪里开始。我无法复制/粘贴插件，我的代码很少。

我要问的是，如果有人有这个插件的经验，可以提供一些操作视图框的建议，而不会丢弃标记的缩放，平移和缩放。感谢。

Answer 1

这是另一个世界的jQuery交互式SVG地图：http://bit.ly/QtBrrr它是纯HTML5，带有可自定义的弹出窗口。

Answer 2

您可以尝试jVectorMap。这是一个类似的解决方案，但它是完全免费的。 API包含setFocus方法，该方法允许将视口设置为某个区域而不会出现问题。