cesium实体移动

实现思路：

1.监听该实体的鼠标按下事件，锁定相机，防止地图跟着实体一起移动

2.在鼠标按下事件中监听该实体的移动事件，获取该实体当前移动的位置信息，替换该实体目前所在的位置信息

3.在鼠标按下事件中监听该实体的鼠标抬起事件，销毁该实体的鼠标移动事件

/*创建一个点的实体*/
let list = {
  id:'point2',
  name:'点',
  show:true,
  position:Cesium.Cartesian3.fromDegrees(113.23459435171017,21.946054252343682,0),
  point:{
    color:Cesium.Color.GREEN,
    pixelSize:20,
    outlineColor: Cesium.Color.SKYBLUE, //边框颜色
    outlineWidth: 2, //边框宽度
    heightReference: Cesium.HeightReference.CLAMP_TO_GROUND, //贴地
    disableDepthTestDistance: Number.POSITIVE_INFINITY,
  }
}
let entity = viewer.entities.add(list)
pageResource.draftingList.floatModels.push(entity);
pageResource.draftingList.floatModelIds.push(list.id);
pageResource.draftingList.clickHandler = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas);
//注册鼠标按下事件
pageResource.draftingList.clickHandler.setInputAction((event)=>{
  const pick = viewer.scene.pick(event.position);
  if (pick?.id && pageResource.draftingList.floatModelIds.includes(pick.id.id)){
    viewer.scene.screenSpaceCameraController.enableRotate = false;
    //更改点的颜色
    pick.id.point.color = Cesium.Color.fromAlpha(Cesium.Color.RED, 1)
    //注册鼠标拖拽事件
    pageResource.draftingList.clickHandler.setInputAction((event)=>{
      const position = event.endPosition // event有startPosition与endPosition两个属性，即移动前后的位置信息：Cartesian2对象
      const cartesian = viewer.scene.globe.pick(viewer.camera.getPickRay(position), viewer.scene);//将Cartesian2转为Cartesian3
      //更改点的位置
      pick.id.position = cartesian;
    },Cesium.ScreenSpaceEventType.MOUSE_MOVE)
    //注册鼠标抬起事件
    pageResource.draftingList.clickHandler.setInputAction((event)=>{
      if (pick?.id && pageResource.draftingList.floatModelIds.includes(pick.id.id)){
        viewer.scene.screenSpaceCameraController.enableRotate = true;//取消锁定相机
        //更改点的颜色
        pick.id.point.color = Cesium.Color.fromAlpha(Cesium.Color.GREEN, 1)
        pageResource.draftingList.clickHandler.removeInputAction(Cesium.ScreenSpaceEventType.MOUSE_MOVE);
      }
    },Cesium.ScreenSpaceEventType.LEFT_UP)
  }
},Cesium.ScreenSpaceEventType.LEFT_DOWN)

模型的移动也是同样的思路

//添加模型
let data = [
  {
    id: "document",
    version: "1.0",
    clock: {
      interval: "2023-11-23T15:00:11Z/2023-11-23T15:30:10Z",
      currentTime: "2023-11-23T15:00:11Z",
      multiplier: 1,
      range: "LOOP",
      step: "SYSTEM_CLOCK_MULTIPLIER",
    },
    model: null,
    position: null,
    orientation: null,
    label: null,
  },
  {
    id: "待移动的模型",
    version: "",
    clock: null,
    model: {
      gltf: "../box.glb",
      scale: 2,
    },
    //      113.231162, 21.901834,
    position: {
      interpolationAlgorithm: "LINEAR",
      forwardExtrapolationType: "HOLD",
      epoch: "2023-11-23T15:00:11Z",
      heightReference: Cesium.HeightReference.CLAMP_TO_GROUND, //贴地
      cartographicDegrees: [
        0, 113.23459435171017,21.946054252343682, 0,
      ],
    },
    orientation: {
      velocityReference: "#position",
    },
    label: {
      font: "bold 10pt Segoe UI Semibold",
      horizontalOrigin: "CENTER",
      outlineColor: {
        rgba: [0, 0, 0, 255],
      },
      pixelOffset: {
        cartesian2: [0, -30],
      },
      scale: 1,
      text: "",
      verticalOrigin: "CENTER",
      backgroundColor: {
        rgba: [53, 88, 160, 255],
      },
      showBackground: true,
    },
  },
];
let modal1 = await viewer.dataSources.add(Cesium.CzmlDataSource.load(data));
 pageResource.modelMove.floatModels.push(modal1);
 pageResource.modelMove.floatModelIds.push(data[1].id)
 pageResource.modelMove.clickHandler = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas);
 pageResource.modelMove.clickHandler.setInputAction((event)=>{
  const pick = viewer.scene.pick(event.position);
  if(pageResource.modelMove.floatModelIds.includes(pick.id?.id)){
    viewer.scene.screenSpaceCameraController.enableRotate = false;
    //鼠标左键按下时需要执行的操作
    //注册鼠标拖拽事件
    pageResource.modelMove.clickHandler.setInputAction((event)=>{
      const position = event.endPosition // event有startPosition与endPosition两个属性，即移动前后的位置信息：Cartesian2对象
      const cartesian = viewer.scene.globe.pick(viewer.camera.getPickRay(position), viewer.scene);//将Cartesian2转为Cartesian3
      if(cartesian){
        pick.id.position = cartesian;
      }
    },Cesium.ScreenSpaceEventType.MOUSE_MOVE)
    //注册鼠标抬起事件
    pageResource.modelMove.clickHandler.setInputAction((event)=>{
      if (pageResource.modelMove.floatModelIds.includes(pick.id?.id)){
        viewer.scene.screenSpaceCameraController.enableRotate = true;//取消锁定相机
        //鼠标左键抬起时需要执行的操作
        //销毁监控的鼠标移动事件
        pageResource.modelMove.clickHandler.removeInputAction(Cesium.ScreenSpaceEventType.MOUSE_MOVE);
      }
    },Cesium.ScreenSpaceEventType.LEFT_UP)
  }
},Cesium.ScreenSpaceEventType.LEFT_DOWN)