Mapbox实现高度线

贴个群号

WebGIS学习交流群461555818，欢迎大家

效果图

实现与源码

本文主要是提供一个思路，如何利用纯mapbox实现，效果图也只是一个简单的实例。
原理其实是利用fill-extrusion，将线加上缓冲区变成面，然后拉升面，起始高度再拉高，就成了图中这种效果，以为是源码，核心思想是fill-extrusion-height和fill-extrusion-base

            let  line = {
              type:'FeatureCollection',
              features:[{
                type:'Feature',
                geometry:{
                  type:"LineString",
                  coordinates:[[110,20],[110,60]]
                },
                properties:{}
              }]
            }
            let geojson = turf.buffer(line, 5, {units: 'miles'})
            map.addSource('gridline', {
              'type': 'geojson',
              'data': geojson
            });
            map.addLayer({
              'id': 'gridid',
              'type': 'fill-extrusion',
              'source': 'gridline',
              'layout': {
              },
              'paint': {
                'fill-extrusion-color': '#f00',
                'fill-extrusion-height': 700005,
                'fill-extrusion-base': 700000,
              }
            })

3.5.0版本后的mapbox可以直接使用这个属性line-z-offset来为线加高度了，不过不能在球上使用