在GL mapbox中绘制多点方向

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

// 创建数据源
var geojson = {
  type: 'FeatureCollection',
  features: [
    {
      type: 'Feature',
      geometry: {
        type: 'Point',
        coordinates: [lng1, lat1]
      },
      properties: {
        name: 'Point 1'
      }
    },
    {
      type: 'Feature',
      geometry: {
        type: 'Point',
        coordinates: [lng2, lat2]
      },
      properties: {
        name: 'Point 2'
      }
    },
    // 添加更多点...
  ]
};

// 添加数据源
map.addSource('points', {
  type: 'geojson',
  data: geojson
});

// 创建点图层
map.addLayer({
  id: 'points',
  type: 'circle',
  source: 'points',
  paint: {
    'circle-color': '#ff0000',
    'circle-radius': 6
  }
});

// 创建线条数据源
var lineGeojson = {
  type: 'FeatureCollection',
  features: [
    {
      type: 'Feature',
      geometry: {
        type: 'LineString',
        coordinates: [
          [lng1, lat1],
          [lng2, lat2]
        ]
      },
      properties: {
        name: 'Line 1'
      }
    },
    // 添加更多线条...
  ]
};

// 添加线条数据源
map.addSource('lines', {
  type: 'geojson',
  data: lineGeojson
});

// 创建线条图层
map.addLayer({
  id: 'lines',
  type: 'line',
  source: 'lines',
  paint: {
    'line-color': '#0000ff',
    'line-width': 2
  }
});