cesium 请问如何在每次点移动的时候只有最新的点会显示标签,其余的旧的点不显示标签?

作者站长头像
站长
· 阅读数 8

cesium 请问如何在每次点移动的时候只有最新的点会显示标签,其余的旧的点不显示标签?

function locus() {
  var textOne
  emitter.on('webDataValue', (data) => {
    watch(positionParam, (newVal, oldVal) => {
      // console.log("newVal", newVal, 'oldVal', oldVal, 'positionParam', positionParam);
      OldpositionParam.longitude = newVal.longitude;
      OldpositionParam.latitude = newVal.latitude;
    },
      {
        deep: false
      }
    );
    let positions = ref([
      { longitude: OldpositionParam.longitude, latitude: OldpositionParam.latitude, },//旧经纬度
      { longitude: data.longitude, latitude: data.latitude, }//新经纬度
    ])
    const uid = window.localStorage.getItem('CardUID')
    api.terminalInfo(uid).then((terminalInfoData) => {
      if (window.localStorage.getItem('CardUID') === null) {
        return ElMessage({
          message: '终端信息显示:当前车辆终端UID未绑定',
          type: "error"
        })
      }
      const { data: res } = terminalInfoData
      const fucison = res.data.fusionCounts === 0 ? 0 : res.data.fusionCounts
      const rtk = res.data.rtkCounts === 0 ? 0 : res.data.rtkCounts
      const uwb = res.data.uwbCounts === 0 ? 0 : res.data.uwbCounts
      textOne = `终端ID:${res.data.uid}\n定位类型:${TargetingType.value},融合频率:${fucison},RTK频率:${rtk},UWB频率:${uwb}`;
    })
    // 添加点
    positions.value.forEach((position, index) => {
      viewer.value.entities.values.forEach(entity => {
        if (entity.label && entity.label.text == textOne) {
          entity.label.show = false;
        }
      });
      let cartesian3 = Cesium.Cartesian3.fromDegrees(position.longitude, position.latitude)
      viewer.value.entities.add({
        position: cartesian3,
        point: {
          pixelSize: 10,
          color: Cesium.Color.RED,
          outlineColor: Cesium.Color.WHITE,
          outlineWidth: 1,
        },
        label: {
          text: textOne,
          font: '14pt monospace',
          show: new Cesium.CallbackProperty(() => {
            return index === positions.value.length - 1;
          }, false),
          style: Cesium.LabelStyle.FILL_AND_OUTLINE,
          outlineWidth: 2,
          verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
          pixelOffset: new Cesium.Cartesian2(0, -9),
        },
      });
    });
    // 添加轨迹线
    viewer.value.entities.add({
      polyline: {
        positions: Cesium.Cartesian3.fromDegreesArray(positions.value.flatMap(pos => [pos.longitude, pos.latitude])),
        width: 2,
        material: Cesium.Color.RED,//折线的材质,可以是颜色或贴图的材质
      },
    });
  })
}

cesium 请问如何在每次点移动的时候只有最新的点会显示标签,其余的旧的点不显示标签?更新代码:

let entityList = []
  positions.value.forEach((position, index) => {
    let entityIndex = entityList.length
    let cartesian3 = Cesium.Cartesian3.fromDegrees(position.longitude, position.latitude)
    let entity = new Cesium.Entity({
      position: cartesian3,
      point: {
        pixelSize: 10,
        color: Cesium.Color.RED,
        outlineColor: Cesium.Color.WHITE,
        outlineWidth: 1,
      },
      label: {
        text: 'text',
        font: '14pt monospace',
        show: new Cesium.CallbackProperty(() => {
          return entityIndex === entityList.length - 1;
        }, false),
        style: Cesium.LabelStyle.FILL_AND_OUTLINE,
        outlineWidth: 2,
        verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
        pixelOffset: new Cesium.Cartesian2(0, -9),

      },
    });
    entityList.push(entity)
    viewer.value.entities.add(entity)
  });
回复
1个回答
avatar
test
2024-07-01

CallbackProperty函数的第二个参数写false,另外函数里面你应该用一个公用的变量进行计算,而不是positions,因为你的positions是监听webDataValue不断地生成的,这对于多次添加的entity来说没有变化,都会满足这一要求

回复
likes
适合作为回答的
  • 经过验证的有效解决办法
  • 自己的经验指引,对解决问题有帮助
  • 遵循 Markdown 语法排版,代码语义正确
不该作为回答的
  • 询问内容细节或回复楼层
  • 与题目无关的内容
  • “赞”“顶”“同问”“看手册”“解决了没”等毫无意义的内容