Question

我有一个mapbox.js地图，但参数zoom似乎没有做任何事情我无法在文档中找到它。无论我将zoom设置为缩放级别，始终默认为我的项目缩放级别以下是代码：

<script src='https://api.tiles.mapbox.com/mapbox.js/v1.6.1/mapbox.js'></script>
<link href='https://api.tiles.mapbox.com/mapbox.js/v1.6.1/mapbox.css' rel='stylesheet' />

$(document).ready(function() {
        var map = L.mapbox.map('map', 'nhaines.hek4pklk', {
            zoom: 1
        });

        // disable drag and zoom handlers
        map.dragging.disable();
        map.touchZoom.disable();
        map.doubleClickZoom.disable();
        map.scrollWheelZoom.disable();
        // disable tap handler, if present.
        if (map.tap) map.tap.disable();
    });

Answer 1

我花了很多时间去挖掘，但我自己想出来了。开发者还没有做出回应。我们一切都错了。这是做什么的：

首先，创建MapBox对象，但将zoomAnimation设置为false。 This question帮助我意识到在CSS3动画正在进行时尝试setZoom将无法正常工作，因为它很难突破。至少那是我的想法。将zoomAnimation设置为true可让地图设置动画并绕过任何自定义缩放级别，因此显然这非常重要。

var map = L.mapbox.map('map', 'username.map_id', {
    zoomAnimation: false
});

接下来，创建一个多边形图层并从地图的geojson添加到地图。您可以在MapBox项目中找到它＆gt;信息标签。（在我的例子中，这个geojson恰好包含多边形的lat / lng坐标，但你的情况可能不同。featureLayer()仍应添加geojson。）

var polygonLayer = L.mapbox.featureLayer().loadURL('http://your/maps/geojson').addTo(map);

在多边形图层（或任何你的lat / lng坐标）之后添加到地图

polygonLayer.on('ready', function() {
    // featureLayer.getBounds() returns the corners of the furthest-out markers,
    // and map.fitBounds() makes sure that the map contains these.
    map.fitBounds(polygonLayer.getBounds());

    map.setView(map.getCenter(), 10);
}

显然fitBounds符合map要求，允许在其上调用setView，因为现在您可以直接调用map对象来获取中心lat / LNG。

我还没有在简单的情况下对此进行测试 - 我从我的代码中调整了这个代码，该代码在迭代一系列MapBox地图时检查地址的lat / lng坐标是否落在多边形内。它应该让你去。希望它有所帮助！

Mapbox.js设置了地图默认缩放选项

1 个答案: