适合地图以显示世界

Jac*_*son 6 javascript jquery leaflet

现在我要做的是根据屏幕尺寸放大和缩小地图,这样你就可以随时看到世界上每块土地.我并不担心重复的世界,但我理想的是希望它基本上集中在非洲西海岸,就像一张典型的地图.

我有一些看起来如下:

function fitMap() {
    if ($) {
        var height = $(window).height();
        var width = $(window).width();
        //Put map into full screen
        $('#map').css({position: "absolute", top: "0", left: "0", right: "0", bottom:"0"});

        if ((height < 586 && width < 1095) || height < 325 || (width < 700 && height > 586)) {
            map.setZoom(1);
        }
        else if (width >= 1500 && height > 900) {
            map.setZoom(3);
        } 
        else {
            map.setZoom(2);
        }
    }
};

//Fit the map more appropriately to screen sizes.
window.onload = fitMap;
window.onresize = fitMap;
Run Code Online (Sandbox Code Playgroud)

我觉得这真的很hacky,如果我试着将它放在一个1920x1080到一个小的1024x768,但是我没有在Leaflet中看到任何允许我这样做的东西.我的一个想法是创建一个不可见的功能组,基本上创建一个从dateline到dateline的边界,并使用.getBounds()如下:使用getbounds和相关问题居中传单

有没有人有更好的解决方案?

Bre*_*ody 7

Leaflet提供了一种fitWorld()方法来做到这一点.

你可以通过调用来使用它map.fitWorld();,这是一个完整的例子.

  • 旧线程,但对于未来的查找器,您可以使用`map.fitWorld().zoomIn();` (3认同)