图标必须在不同的视图级别可见

Question

我使用openlayers3来构建一个应用程序

我想改变zoomlevel图标是可见的

https://bestofosm.org/?lon=4.0798&lat=50.9136&zoom=15#interesting-het-loo-garden

例如

如果你去伦敦，你可以在zoomlevel 10看到机场

假设我希望所有旅游图标在缩放级别10可见，而机场图标在缩放级别15这可能吗？

Answer 1

最简单的解决方案是将您的标记放在不同的图层中，并为每个图层指定minResolution和maxResolution。当地图在这些分辨率之外缩放时，图层将自动隐藏。就像是：

var touristicIcons = new ol.layer.Vector({
    source: touristicIconsSource,
    minResolution: xx
    maxResolution: xx
});

// Repeat for airports layer, with different resolutions

将缩放级别写为分辨率将不起作用。您需要找出所需缩放级别的分辨率。最简单的方法是使用这个小小的黑客，每次滚动地图时记录缩放级别和分辨率：

map.getView().on('change:resolution', function (event) {
    var view = event.currentTarget;
    console.log('Zoom: ' + view.getZoom() + 
                ', resolution: ' + view.getResolution());
});