当前位置:网站首页 > React Native移动开发 > 正文

cesium在三维地图中拖拽移动实体位置

var viewer = new Cesium.Viewer('cesiumContainer'); viewer.entities.add({ id:'id', position : Cesium.Cartesian3.fromDegrees(-75.59777, 40.03883), billboard :{ image : '../images/Cesium_Logo_overlay.png' } }); var pointDraged = null; var leftDownFlag=false; viewer.screenSpaceEventHandler.setInputAction(leftDownAction, Cesium.ScreenSpaceEventType.LEFT_DOWN); viewer.screenSpaceEventHandler.setInputAction(leftUpAction, Cesium.ScreenSpaceEventType.LEFT_UP); viewer.screenSpaceEventHandler.setInputAction(mouseMoveAction, Cesium.ScreenSpaceEventType.MOUSE_MOVE); function leftDownAction(e) { console.log("左键按下"); pointDraged = viewer.scene.pick(e.position);//选取当前的entity leftDownFlag = true; if (pointDraged) { viewer.scene.screenSpaceCameraController.enableRotate = false;//锁定相机 } } function leftUpAction(e) { console.log("左键抬起"); leftDownFlag = false; pointDraged=null; viewer.scene.screenSpaceCameraController.enableRotate = true;//解锁相机 } function mouseMoveAction(e) { if (leftDownFlag === true && pointDraged != null) { console.log("鼠标移动"); var ray = viewer.camera.getPickRay(e.endPosition); var cartesian = viewer.scene.globe.pick(ray, viewer.scene); console.log(cartesian); pointDraged.id.position = new Cesium.CallbackProperty(function () { return cartesian; }, false);//此处根据具体entity来处理,也可能是pointDraged.id.position=cartesian; } }

线上测试环境:沙盘环境

到此这篇cesium在三维地图中拖拽移动实体位置的文章就介绍到这了,更多相关内容请继续浏览下面的相关推荐文章,希望大家都能在编程的领域有一番成就!

版权声明


相关文章:

  • 移动端相关信息获取2024-12-02 10:54:06
  • 抓包工具使用&移动端调试2024-12-02 10:54:06
  • 创建一个新的react项⽬时报错2024-12-02 10:54:06
  • 1.React核心入门2024-12-02 10:54:06
  • 2.React组件化2024-12-02 10:54:06
  • cesium在二维地图中拖拽移动实体2024-12-02 10:54:06
  • react 入门教程(react从入门到精通)2024-12-02 10:54:06
  • react入门到精通(react 入门)2024-12-02 10:54:06
  • react组件调用方法(react组件constructor)2024-12-02 10:54:06
  • react入门视频教程(react教程,看这篇就够了)2024-12-02 10:54:06
  • 全屏图片