maps - 如何使用 Leaflet API 更改 map 的位置中心？

Question

我的 map (Mapbox) 占据了站点的整个背景，因此中心位于站点的中间。但是用户的 map 的焦点在右侧，因为我的内容与左侧的 map 重叠。当传单抓取位置时，它是从 map 的中心，但如果我可以将它设置为从站点右三分之一的中心抓取位置会更方便，这样用户就不会居中 map 上的目标与网站左半部分的内容接壤。

有没有办法可以为 map 设置传单 API 的中心或位置焦点？

这是我目前的设置方式，

mapOptions: {
        maxZoom: 18,
        zoomControl: false,
        worldCopyJump: true 
},

createMap: function() {
        Map.map =  L.map('map', Map.mapOptions);
        Map.layer = L.mapbox.tileLayer(Map.mapID, {
                unloadInvisibleTiles: true,
        }).addTo(Map.map);              
        Map.map.locate({setView: true});
        Map.map.addControl(L.mapbox.geocoderControl(Map.mapID));
        new L.Control.Zoom({ position: 'topright' }).addTo(Map.map);
},

Answer 1

您可以使用 panBy() 的组合和 getSize()偏移 map 覆盖的宽度。

这是一个应该让你开始的片段:

// Calculate the offset
var offset = map.getSize().x*0.15;
// Then move the map
map.panBy(new L.Point(-offset, 0), {animate: false});

在我的示例中，我的叠加层是 map 宽度的 33%。所以我捕获 map 区域的大小，然后乘以 0.15(这是基于一些实验来查看最佳偏移量是多少)并使用 panBy()偏移 map 中心。

这是一个 full example .