Cesium场景内添加模型

最新推荐文章于 2025-05-12 20:32:35 发布

SaCai_

最新推荐文章于 2025-05-12 20:32:35 发布

阅读量886

点赞数 5

CC 4.0 BY-SA版权

文章标签：前端

本文链接：https://blog.csdn.net/SaCai_/article/details/138285936

Cesium场景内鼠标添加模型

核心思想

最近在项目中，需要实现在cesium中双击空间内一点添加标识牌模型，其实做法也很简单：

监听鼠标双击事件
2.获取当前position的笛卡尔坐标
根据笛卡尔坐标获取经纬度与高度（高度需要地理高度，保证模型接地）
根据位置信息在当前位置生成一个弹窗，里面需要去设置添加模型的一些属性
viewer.entities.add添加模型

具体做法

监听鼠标双击事件

var canvas=viewer.scene.canvas;
let handler = new Cesium.ScreenSpaceEventHandler(canvas);
handler.setInputAction(function (event) {
   
     
//具体功能
}, Cesium.ScreenSpaceEventType.LEFT_DOUBLE_CLICK）

2.获取当前position的笛卡尔坐标,然后转化成经纬度高度信息
这一块放在监听事件里

 var lon;
 var lat;
 var height;
 var cartographic;
 var scene = viewer.scene;
 var ellipsoid = scene.globe.ellipsoid;
 var cartesian = viewer.scene.pickPosition(event.position);//笛卡尔坐标
 viewer.scene.globe.depthTestAgainstTerrain = true;
 console.log('笛卡尔坐标 :>> ', cartesian);
   if (cartesian) {
   
   
     cartographic = ellipsoid.cartesianToCartographic(cartesian);//地图坐标
     lon = Cesium.Math.toDegrees(cartographic.longitude).toFixed(10);
     lat = Cesium.Math.toDegrees(cartographic.latitude).toFixed(10);
     //地理高度
     height = (cartographic.height+1).toFixed(5);
     //相机高度