無法在Mapbox中添加樓層GL

我想爲使用MapBox GL的每個建築物添加2層或3層樓，但是當我嘗試使用添加層時，顏色會被覆蓋，但不會添加圖層或樓層。現在一直堅持這一段時間。無法在Mapbox中添加樓層GL

我想要在建築物中的三維地板的擠壓。

試圖把這個按鈕點擊，但它仍然沒有返回預期的結果。

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <meta charset='utf-8' /> 
 
    <title></title> 
 
    <meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' /> 
 
    <script src='https://api.tiles.mapbox.com/mapbox-gl-js/v0.39.1/mapbox-gl.js'></script> 
 
    <link href='https://api.tiles.mapbox.com/mapbox-gl-js/v0.39.1/mapbox-gl.css' rel='stylesheet' /> 
 
    <style> 
 
     body { margin:0; padding:0; } 
 
     #map { position:absolute; top:0; bottom:0; width:100%; } 
 
    </style> 
 

 
</head> 
 
<body> 
 

 
<div id='map'> 
 
</div> 
 
<script> 
 
mapboxgl.accessToken = 'pk.eyJ1IjoiZGFuc3dpY2siLCJhIjoiY2l1dTUzcmgxMDJ0djJ0b2VhY2sxNXBiMyJ9.25Qs4HNEkHubd4_Awbd8Og'; 
 
var map = new mapboxgl.Map({ 
 
    container: 'map', 
 
    style: 'mapbox://styles/mapbox/streets-v9', 
 
    center: [-87.61694, 41.86625], 
 
    zoom: 15.99, 
 
    pitch: 40, 
 
    bearing: 20 
 
}); 
 

 
map.on('load', function() { 
 

 
    map.addLayer({ 
 
     'id': 'room-extrusion10', 
 
     'type': 'fill-extrusion', 
 
     'source': 'composite', 
 
     'source-layer': 'building', 
 
     'paint': { 
 
      'fill-extrusion-color': 'blue', 
 
      'fill-extrusion-height': { 
 
       'type': 'identity', 
 
       'property': 'height' 
 
      }, 
 
      'fill-extrusion-base': { 
 
       'type': 'identity', 
 
       'property': 'max_height' 
 
      }, 
 
      'fill-extrusion-opacity': 1 
 
     } 
 
    }); 
 

 
    map.addLayer({ 
 
     'id': 'room-extrusion11', 
 
     'type': 'fill-extrusion', 
 
     'source': 'composite', 
 
     'source-layer': 'building', 
 
     'paint': { 
 
      'fill-extrusion-color': 'red', 
 
      'fill-extrusion-height': { 
 
       'type': 'identity', 
 
       'property': 'height' 
 
      }, 
 
      'fill-extrusion-base': { 
 
       'type': 'identity', 
 
       'property': 'min_height' 
 
      }, 
 
      'fill-extrusion-opacity': 1 
 
     } 
 
    },'room-extrusion10'); 
 

 
}); 
 
</script> 
 

 
</body> 
 
</html>

來源

2017-09-04 ashwinsakthi

fill-extrusion-height和fill-extrusion-base是控制填充擠出特徵的下部和上部身高（米）的塗料性能。在你的例子中，這些樣式的格式爲identity functions，基於來自OpenStreetMap（在Mapbox Streets數據源中）的建築高度數據，使它們模仿真實世界的建築物形狀（最好與它們映射的一樣）。爲了創建一個只包含一層的填充擠出層，您希望fill-extrusion-height: 3（或者無論高度，以米爲單位，您會感受到一個故事）和fill-extrusion-base: 0爲一層;第二個是height = 6，base = 3，等等。

請注意，在所有發佈版本的Mapbox GL JS中，相對於彼此的多個填充擠出層don't render correctly。這是主版本中的fixed，並將包含在本月的下一個版本中。

來源

2017-09-05 17:53:52

非常感謝你的回覆。你還可以告訴我如何限制在一個單一的建築物或財產而不是在整個城市的地圖上顯示擠出物。我想專注於單個建築物，並根據填充 - 擠出 - 高度和填充 - 擠出 - 基礎屬性添加相應的層或層。 – ashwinsakthi

無法在Mapbox中添加樓層GL

回答

相關問題