Leaflet 关于移动/小型视口的传单

我在使用传单的fitBounds方法时遇到了一些奇怪的问题，这些问题似乎只有在移动设备或桌面上的移动大小的浏览器窗口中进行测试时才会出现。我给Fitbunds一个西南角和一个东北角对应两个标记。在全尺寸屏幕上，它工作良好；地图以适当的缩放级别在两者之间重新居中，您可以看到两者。但在一个纵向的小屏幕上，地图中心似乎位于两个标记之间的中心偏东，并且每个标记都略超出窗口。如果我稍微拖动一下地图，它就会突然向东跳跃，似乎在两个标记之间的适当中心点上重新居中

以下是我的代码：

var bounds = L.latLngBounds([coordLats[0], coordLons[0]], [coordLats[1], coordLons[1]]);
map.fitBounds(bounds);
fixZoom();

function fixZoom(){
    var z = map.getZoom()
    z = z > 18 ? 18 : z; //don't go beyond max zoom!
    map.setZoom(z);
};

coordLats和coordLongs是分别具有两个标记纬度和经度的数组，从最小到最大排列

---

有什么想法吗？

首先，不要使用这种粗糙的maxZoom黑客。L.TileLayer中有一个选项用于设置最大缩放

L.tileLayer('http://tiles.lyrk.org/lr/{z}/{x}/{y}', {
    maxZoom: 18
}).addTo(map);

除此之外，请确保包含正确的视口。若你们不提供，传单可能会有一些不想要的行为

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">