Javascript jVectorMap中的滚动控件

我使用的是jVectorMap，没有缩放，一切都很好

但是当用户放大页面时，我需要允许用户使用垂直和水平滚动条滚动地图

我已经尝试添加overflow-y:scroll；和其他许多选项来做滚动，但没有什么工作完美

我可以设置div的宽度和高度以获得滚动条，但它与地图放大和缩小无关

因此，我期待着一个滚动条水平和垂直，使用该用户可以看到完整的地图，即使它是缩放

我在网上看到了一张有下图的地图

但不知道如何在jVector地图中添加这样的滚动按钮控件。 有人能帮我解决这个问题吗？

您需要两个步骤：

要了解映射在容器内的转换方式，请使用onViewportChange事件初始化映射：

切中要害： 要应用贴图转换，请设置所需的X和Y平移，最后调用applyTransform函数：

例如：

var worldMap = $("#map").vectorMap("get", "mapObject");
worldMap.transX = -100;
worldMap.applyTransform();

其他信息：

幸运的是，jVectorMap将为您进行范围检查，因此对于您的平移按钮，您也可以简单地使用以下内容：

worldMap.transX -= (10 * worldMap.scale); // move left
worldMap.transX += (10 * worldMap.scale); // move right
worldMap.transY -= (10 * worldMap.scale); // move up
worldMap.transY += (10 * worldMap.scale); // move down

您将在中的applyTransform函数中找到范围检查

作者：，jVectorMap的伟大作者

最后，重新居中按钮： 您可以按如下方式获取地图的中心：

var mapCX = (worldMap.width / 2) * worldMap.scale + worldMap.transX * worldMap.scale;
var mapCY = (worldMap.height / 2) * worldMap.scale + worldMap.transY * worldMap.scale;

---

由于您没有提供任何源代码，我无法进一步提供帮助，但如果您理解了这个概念，滚动条范围和地图翻译之间的转换非常简单。

applyTransform未定义错误即将到来，我有一个自定义按钮附加到地图上，我尝试从该按钮调用applyTranform clickworking，当我像worldMap.ApplyTransferormbut一样调用它时，问题是当我们不能在这里进行长时间单击事件时，因为转换用户需要反复单击，有没有办法使用滚动条来执行相同的操作？？在您的图片中，滚动条用于缩放，而旋钮有用于平移和居中的按钮。无论如何，如果你需要一个滚动条，这里有一个：@ArunprasanthKV:THX感谢你的赏识，欢迎再次询问，我很乐意帮助你！

var mapCX = (worldMap.width / 2) * worldMap.scale + worldMap.transX * worldMap.scale;
var mapCY = (worldMap.height / 2) * worldMap.scale + worldMap.transY * worldMap.scale;