【mapbox for javascript】绘制多边形图层并可进行编辑图层

xiaozhahza

已于 2023-04-25 19:31:52 修改

阅读量319

点赞数

文章标签： javascript 前端 html

于 2023-04-25 19:31:21 首次发布

本文链接：https://blog.csdn.net/xiaozhahza/article/details/130372161

版权

 // 初始化点线面source对象
const jsonLine = {
   
  type: 'FeatureCollection',
  features: [
    {
   
      type: 'Feature',
      geometry: {
   
        type: 'LineString',
        coordinates: []
      }
    }
  ]
}
const jsonPoint = {
   
  type: 'FeatureCollection',
  features: []
}
const jsonFull = {
   
  type: 'FeatureCollection',
  features: [
    {
   
      type: 'Feature',
      geometry: {
   
        type: 'Polygon',
        coordinates: [
          []
        ]
      }
    }
  ]
}

// 清除draw资源图层
export function clearLayerAndSource (map) {
   
  if (map.getSource('circlePlan')) {
   
    map.removeLayer('circlePlan')
    map.removeSource('circlePlan')
  } else if (map.getLayer('silmp')) {
   
    map.removeLayer('silmp')
    map.removeSource('silmp')
  }
  if (map.getLayer('line')) {
   
    map.removeLayer('line')
  }
  if (map.getLayer('line')) {
   
    map.removeLayer('line')
  }
  if (map.getSource('line')) {
   
    map.removeSource('line')
  }
  if (map.getLayer('points')) {
   
    map.removeLayer('points')
  }
  if (map.getSource('points')) {
   
    map.removeSource('points')
  }
  if (map.getLayer('polygon')) {
   
    map.removeLayer('polygon')
  }
  if (map.getSource('polygon')) {
   
    map.removeSource('polygon')
  }
  if (map.getLayer('line-move')) {
   
    map.removeLayer('line-move')
  }
  if (map.