【问题标题】:Leaflet - Fitbounds and keep center传单 - Fitbounds 并保持居中
【发布时间】:2016-10-29 06:46:25
【问题描述】:

我正在使用带有 Mapbox 的 Leaflet,我想设置地图的视图:

  1. 所有标记都可见
  2. 中心设置为特定点

使用 setView 和 fitbounds 分别处理每个点很容易,但我不知道如何同时拥有这两个点,因为 setView 更改了边界,而 fitBounds 更改了中心。一个解决方案可能是定义一个中心和一个缩放,但我怎么知道哪个缩放可以让我的所有标记都可见?

编辑

我实施了 IvanSanchez 建议的解决方案,它按预期工作:

let ne=leafletBounds.getNorthEast();
let sw=leafletBounds.getSouthWest();
let neSymetric=[ne.lat + (center.lat - ne.lat)*2, ne.lng + (center.lng - ne.lng)*2];
let swSymetric=[sw.lat +(center.lat - sw.lat)*2, sw.lng + (center.lng - sw.lng)*2];
leafletBounds.extend(L.latLngBounds(swSymetric, neSymetric));

【问题讨论】:

    标签: leaflet fitbounds


    【解决方案1】:

    我找到了另一个解决方案。使用 fitBound() 调整地图后,您可以简单地调用 map.panTo([lat, lng])。我正在使用 VueJs 并在 mount() 生命周期挂钩中调用它。

    我正在拟合边界,因此您可以看到用户的位置以及远处的地理特征,但是我使用 panTo,因此用户的真实位置在 fitBounds 之后位于地图的中心。到目前为止,它似乎可以无缝运行。

    【讨论】:

      【解决方案2】:

      获取边界,并通过沿所需中心点应用点对称来创建第二个 L.Bounds 实例。创建一个包含原始边界和对称边界的新 L.Bounds。运行fitBounds()

      【讨论】:

      • 谢谢,这是一个简单有效的解决方案!
      猜你喜欢
      • 1970-01-01
      • 2015-06-26
      • 2013-04-15
      • 1970-01-01
      • 2013-01-26
      • 2020-02-01
      • 1970-01-01
      • 2016-05-16
      • 2016-05-05
      相关资源
      最近更新 更多