mapboxgl画线

要在Mapbox-GL地图上画线，可以使用Mapbox-GL的API方法来实现。下面是一种可能的方法：

首先，确保你已经引入了Mapbox-GL的库文件，并且创建了一个地图容器。然后，使用Mapbox-GL提供的`addLayer`方法来添加一个线条图层。

在`addLayer`方法中，你可以指定线条的样式和数据源。样式可以定义线条的颜色、宽度和其他属性，数据源可以定义线条的坐标点。

接下来，你可以使用`setData`方法将线条的坐标数据传递给数据源。坐标数据应该是一个包含经纬度信息的数组。

最后，将线条图层添加到地图中。你可以使用`addLayer`方法将图层添加到地图的指定位置。

下面是一个示例代码：

// 创建地图容器
var map = new mapboxgl.Map({
  container: 'map-container',
  style: 'mapbox://styles/mapbox/streets-v11',
});

// 添加线条图层
map.addLayer({
  id: 'line-layer',
  type: 'line',
  source: {
    type: 'geojson',
    data: {
      type: 'Feature',
      geometry: {
        type: 'LineString',
        coordinates: [[lng1, lat1], [lng2, lat2], [lng3, lat3]] // 坐标点数组
      }
    }
  },
  paint: {
    'line-color': '#ff0000', // 线条颜色
    'line-width': 2 // 线条宽度
  }
});

// 设置线条图层的数据源
map.getSource('line-layer').setData({
  type: 'Feature',
  geometry: {
    type: 'LineString',
    coordinates: [[lng1, lat1], [lng2, lat2], [lng3, lat3]] // 坐标点数组
  }
});

// 将线条图层添加到地图中
map.addLayer({
  id: 'line-layer',
  type: 'line',
  source: 'line-source',
  paint: {
    'line-color': '#ff0000', // 线条颜色
    'line-width': 2 // 线条宽度
  }
});

以上就是使用Mapbox-GL画线的方法。你可以根据自己的需求修改样式和坐标数据，以实现不同的效果。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* *2* *3* [Vue Mapbox-GL 在地图中增加图标、线条、标记点击弹窗、地图平移](https://blog.csdn.net/weixin_49032614/article/details/125545247)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 100%"]
[ .reference_list ]