共计 851 个字符,预计需要花费 3 分钟才能阅读完成。
mapbox 依据地形高度渲色彩
这里分为两种形式来实现,别离对应实用于设计师的 mapbox studio
配置形式,和实用于开发者的代码更改形式,常规先看最终成果
查看交互式的最终成果
实用于设计人员的形式
先新建一个地图,根底款式任意抉择
先设置高度,这样就有了线稿个别的轮廓
而后咱们新建一个图层,留神这一步抉择如图所示的内容能够拿到地形高度信息,随后在 type
里设置为fill-extrusion
而后设置色彩就和上色一样,规定由您任意定制
实用于开发者的形式
须要留神 如果您应用了本人的 DEM 源,您须要更改源和高度获取形式为您所应用数据源的配套值
map.on('load',()=>{
map.addSource('mapbox-dem', {
"type": "vector",
"url": "mapbox://mapbox.mapbox-terrain-v2"
});
map.addLayer({
id:'tinting-layer',
'source': 'mapbox-dem',
'source-layer': 'contour',
'type': 'fill-extrusion',
paint:{
"fill-extrusion-color":[
"interpolate",
["linear"],
["get", "ele"],
-410,
"hsl(253, 98%, 42%)",
0,
"hsl(237, 94%, 49%)",
1000,
"hsl(213, 96%, 64%)",
2000,
"hsl(177, 100%, 50%)",
3000,
"hsl(119, 100%, 53%)",
4000,
"hsl(98, 98%, 69%)",
5000,
"hsl(69, 95%, 56%)",
6000,
"hsl(27, 95%, 56%)",
7000,
"hsl(0, 96%, 64%)"
],
"fill-extrusion-height":[
"interpolate",
["linear"],
["get", "ele"],
0,
0,
8840,
8840
]
}
})
})
查看交互式的最终成果
正文完