我使用 MapboxGL JS v2 和 mapbox://styles/mapbox/streets-v11
样式。
同时我使用以下代码在我的地图上显示3D建筑物:
map.addLayer({
'id': '3d-buildings',
'source': 'composite',
'source-layer': 'building',
'filter': ['==', 'extrude', 'true'],
'type': 'fill-extrusion',
'minzoom': 15,
'paint': {
'fill-extrusion-color': '#666',
'fill-extrusion-height': ['interpolate', ['linear'], ['zoom'], 15, 0, 15.05, ['get', 'height']],
'fill-extrusion-base': ['interpolate', ['linear'], ['zoom'], 15, 0, 15.05, ['get', 'min_height']],
'fill-extrusion-opacity': 0.9,
}
});
正如在这个示例中所看到的,它正在按预期工作。
现在,我想要的是在较低缩放级别(例如10而不是15)加载这些建筑。
因此,我将 minzoom
从 15
改为 10
,并且还更改了使用线性插值从 10
到 15.05
的 interpolate
设置。
下面是最终代码:
map.addLayer({
'id': '3d-buildings',
'source': 'composite',
'source-layer': 'building',
'filter': ['==', 'extrude', 'true'],
'type': 'fill-extrusion',
'minzoom': 10,
'paint': {
'fill-extrusion-color': '#666',
'fill-extrusion-height': ['interpolate', ['linear'], ['zoom'], 10, 0, 15.05, ['get', 'height']],
'fill-extrusion-base': ['interpolate', ['linear'], ['zoom'], 10, 0, 15.05, ['get', 'min_height']],
'fill-extrusion-opacity': 0.9,
}
});
不幸的是,它没有起作用,看起来它仍然在等待缩放级别15加载,并且我没有在互联网上找到任何可以使它工作的东西。
new mapboxgl.Map({ style: 'mapbox://styles/mapbox/light-v10', center: [-74.0066, 40.7135], zoom: 10, //<----here pitch: 45, bearing: -17.6, container: 'map', antialias: true });
? - Dolly