4

我希望能够在您单击某个功能时将其拟合到某个功能,但是当它放大时,我希望它考虑到一个控制层,该控制层一旦放大就会出现,并且放大但只有大约 150px 到左。目前我可以使用以下代码完成此操作,但不幸的是它不是平滑缩放,因为我当前的方法将使用 fitBounds 进行缩放,然后一旦缩放它使用 panBy 向左平移 150px。如果平移是平稳的,这可能不会那么糟糕,也许在等待 250 毫秒之后。理想情况下,我希望能够对传递给 fitBounds 方法的边界进行一些数学运算,以简单地考虑向左移动 150px。

这是我目前正在工作的一个例子。

这是我正在使用的代码的简化版本:(您可以单击此处获取包含所有源代码的完整工作版本)

当你点击

function clickFeature(e) {
  var layer = e.target;

  map.fitBounds(layer.getBounds());
}

zoomEnd 上的地图:

map.on({
  zoomend: function() {
    map.panBy([150, 0]);
  }
});

所以,我已经实现了预期的功能,但它并不顺利。

有没有一种方法可以对我们为单击功能获得的边界进行一些数学运算,以便在缩放时放大到已经修改的坐标,从而消除两步动画过程?

4

2 回答 2

0

首先,您可以使用平移选项控制动画。这可以帮助您使过渡更顺畅。你可以在这里看到那些。

其次,您可以使用转换函数计算所需的偏移量。这些可以在这里看到。

例如,您可以执行类似的操作(在我的脑海中)使用 getBoundsZoom 作为多边形边界上的地图对象来计算您未来的缩放,然后在项目函数中使用该缩放与多边形并创建一个新的 LatLngBound from稍微偏移的多边形边界。

希望这可以帮助!

于 2013-09-09T07:01:47.973 回答
0

我有同样的问题,如果比我想象的更容易!您可以在 fitBounds 方法上设置填充(以及所有的平移/缩放方法)

http://leafletjs.com/reference.html#map-fitboundsoptions

所以:

map.fitBounds(layer.getBounds(),{paddingBottomRight:[150,0]});
于 2014-04-24T16:54:08.340 回答