Cesium 创建面

其一：求出地形高度

const getTerrain = async position => {
  let positionArray = []
  position.forEach(item => {
    positionArray.push(Cesium.Cartographic.fromDegrees(item[0], item[1]))
  })
  let updatedPositions = await Cesium.sampleTerrainMostDetailed(
    window.cesium?.viewer?.terrainProvider,
    positionArray,
  )
  if (updatedPositions.length == 1) {
    return updatedPositions[0]
  } else {
    return updatedPositions
  }
}

其二：先创建面包含的点

const createPoints = (point,aPoindId) => {
    if(point.altitude == undefined || point.altitude == null){
      getTerrain([[point.longitude, point.latitude]]).then(res => {
        point.altitude = res.height
        createPointsCore(point,aPoindId)
      })
    }else{
        createPointsCore(point,aPoindId)
    }
  }
const tranColor = new Cesium.Color.fromBytes ( 0, 0, 0, 0 )
const createPointsCore = (Point,aPoindId) => {
    const colors = Cesium.Color.YELLOW
    window.cesium.entity.trends.Level1.entities.add({
      type: `Point`,
      id: aPoindId,
      pointData:{longitude:Point.longitude,latitude:Point.latitude,aPoindId:aPoindId},
      position: Cesium.Cartesian3.fromDegrees(Point.longitude, Point.latitude, Point.altitude),
      point: {
        show: true, // 是否显示
        color: colors.withAlpha(0.7), // 点位颜色
        // outlineColor: colors.withAlpha(0.7),
        // outlineWidth: 3,
        pixelSize: 12, // 大小
        disableDepthTestDistance:50000,
      },
    })
}

其三：根据点创建面

const create = (data,height,name,id) => {
    const len = data.area.length
    if (len < 3) {
      ElMessage.error('请添加至少三个点！')
      return false
    }
    if (!height){
      height = 0
    }
    let fromDegreesArray = []
    data.area.forEach(item => {
      const items = item.coordinate.split(',')
      fromDegreesArray.push(items[0], items[1])
    })
    let Datas={pointData:data.area,name,id}
    window.cesium.entity.trends.level.entities.add({
        type: `area`,
        Data: Datas,
        id: Id,
        polygon: {
            heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
            hierarchy: Cesium.Cartesian3.fromDegreesArray(fromDegreesArray),
            outline: true,
            outlineColor: Cesium.Color.YELLOW.withAlpha(0.5),
            outlineWidth: 1,
            material: Cesium.Color.YELLOW.withAlpha(0.5),
        },
    })
    // //如果面的四周需要线条包围可添加线条
    // let lineData = deepClone(data.area)
    // lineData.push(data.area[0])//首尾连接
    // createLines(lineData,Id)//详见主页Cesuim 创建线文章
    return true 
  }