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          ]      }  })})

查看交互式的最终成果