接触Mapbox GL也有一段时间了，一直也没时间将实现的一些demo分享出来，这次就将之前遇到的一个需求分享一下。
UI那边需要分别对建筑物顶层和周身进行渲染，想了半天终于想到个方法。故在此分享一下。
{
//建筑物
"id": "buildingarea",
'type': 'fill-extrusion',
"source": "os",
"minzoom": 15,
"source-layer": "asset_normal_bdtest",
'paint': {
'fill-extrusion-color': "#0f3662",
'fill-extrusion-height': ["to-number",["get", "HEIGHT"]],
'fill-extrusion-base': 0,
"fill-extrusion-pattern": "sion-material-32",
'fill-extrusion-opacity': 1
}
},
{
//建筑物顶层
"id": "buildingtop",
'type': 'fill-extrusion',
"source": "os",
"minzoom": 15,
"source-layer": "asset_normal_bdtest",
'paint': {
'fill-extrusion-color': "#32373b",
'fill-extrusion-height': ["to-number",["get", "HEIGHT"]],
'fill-extrusion-base': ["to-number",["get", "HEIGHT"]],
'fill-extrusion-opacity': 1
}
}
效果图如下：
image.png
当然，根据计算出的建筑物高度，可以对每个楼层都分别渲染，以达到更加酷炫的效果。
