cesium倾斜摄影

倾斜摄影在Cesium上的相关应用。

加载与定位

const tileset = new Cesium.Cesium3DTileset({url: '/public/dayanta/tileset.json',
});
viewer.scene.primitives.add(tileset);   // 加载
viewer.zoomTo(tileset); // 定位

位置调整（先调整后加载）

功能需求：在倾斜摄影加载到Cesium场景之前，更改其位置、高度、旋转等。
实现思路：主要就是在添加Cesium3DTileset之后，不要直接加载；先在tileset.readyPromise.then的回调函数中对倾斜摄影的位置信息进行处理之后再将其加载到Cesium场景中，具体实现详见如下代码。

const tileset = new Cesium.Cesium3DTileset({url: '/public/dayanta/tileset.json',
});
tileset.readyPromise.then((tileset) => {console.log('tileset', tileset);console.log('tileset默认位置', tileset.boundingSphere.center);const params = {tx: 120.72558333333333 - 0.00420,ty: 31.043325 + 0.00159,tz: 200, // 修改高程rx: 30,ry: 0,rz: -65 // 修改旋转};const update3dtilesMaxtrix = (tileset: Cesium.Cesium3DTileset, params: any) => {// 旋转const mx = Cesium.Matrix3.fromRotationX(Cesium.Math.toRadians(params.rx));const my = Cesium.Matrix3.fromRotationY(Cesium.Math.toRadians(params.ry));const mz = Cesium.Matrix3.fromRotationZ(Cesium.Math.toRadians(params.rz));const rotationX = Cesium.Matrix4.fromRotationTranslation(mx);const rotationY = Cesium.Matrix4.fromRotationTranslation(my);const rotationZ = Cesium.Matrix4.fromRotationTranslation(mz);// 平移（修改经纬度）const position = Cesium.Cartesian3.fromDegrees(params.tx, params.ty, params.tz);const m = Cesium.Transforms.eastNorthUpToFixedFrame(position);// 旋转、平移矩阵相乘Cesium.Matrix4.multiply(m, rotationX, m);Cesium.Matrix4.multiply(m, rotationY, m);Cesium.Matrix4.multiply(m, rotationZ, m);// 缩放（修改缩放比例）const scale = Cesium.Matrix4.fromUniformScale(0.95);Cesium.Matrix4.multiply(m, scale, m);// 赋值给tileset(tileset as any)._root.transform = m;}update3dtilesMaxtrix(tileset, params);viewer.scene.primitives.add(tileset);   // 加载console.log('tileset更改后的位置', tileset.boundingSphere.center);viewer.zoomTo(tileset); // 定位
})

倾斜摄影的旋转角度已被调整，符合预期效果。

位置调整（先加载后调整）

功能需求：更改已加载到Cesium场景中的倾斜摄影的高度（下面例子打算将倾斜摄影的高度提升500米）。
实现思路：计算好要更改的高度的值并进行赋值，然后对已加载的倾斜摄影的位置信息进行更新，具体实现详见如下代码。

const tileset = new Cesium.Cesium3DTileset({url: '/public/dayanta/tileset.json',
});
viewer.scene.primitives.add(tileset);
viewer.zoomTo(tileset);
tileset.readyPromise.then((tileset) => {// 获取3Dtlies的bounds范围const boundingSphere = tileset.boundingSphere;// 获取3Dtlies的范围中心点的弧度const cartographic = Cesium.Cartographic.fromCartesian(boundingSphere.center);console.log('cartographic------1', cartographic);setTimeout(() => {const heightOffset = 500; // 要改变的高度// 倾斜摄影本身的位置const surface = Cesium.Cartesian3.fromRadians(cartographic.longitude, cartographic.latitude, cartographic.height);// 倾斜摄影高度改变的位置const offset = Cesium.Cartesian3.fromRadians(cartographic.longitude, cartographic.latitude, cartographic.height + heightOffset);// 定义倾斜摄影的改变状态const translation = Cesium.Cartesian3.subtract(offset, surface, new Cesium.Cartesian3());// 修改倾斜摄影的位置tileset.modelMatrix = Cesium.Matrix4.fromTranslation(translation);viewer.zoomTo(tileset);// 获取改变高度后的3Dtlies的bounds范围const boundingSphereNew = tileset.boundingSphere;// 获取改变高度后的3Dtlies的范围中心点的弧度const cartographicNew = Cesium.Cartographic.fromCartesian(boundingSphereNew.center);console.log('cartographic------2', cartographicNew);}, 15000)
});

未更改高度的倾斜摄影的高度约为430米。更改高度后的倾斜摄影的高度约为930米，两个高度的距离正好是我们更改的高度：500米，符合预期效果。

cesium倾斜摄影相关推荐

6款常见的无人机仿真开发平台（附超详细特点功能对比）
随着无人机与无人集群的快速发展,开发者对于无人机系统仿真测试环境的需求也日渐显现.本文整理了几款常见的无人机仿真平台,旨在为开发者提供一款更为易用.通用且真实可靠的平台. 无人机与无人集群的研制应用快 ...
RflySim平台——高可信度的无人控制系统开发、测试与评估平台
01/RflySim平台背景智能无人系统是一个复杂系统,涉及机械.控制.计算机.通信和材料等多个领域技术,而AI无疑是开发IUS所需的关键技术之一.随着新一代人工智能兴起,我们正面临一场新的工业革命 ...
无人机斜影（倾斜摄影）数据（OSGB）转 Cesium 3dtile 数据归纳总结以及亲测可用示例
无人机斜影(倾斜摄影)数据(OSGB)转 Cesium 3dtile 数据归纳总结以及亲测可用示例运行环境 Cesium 加载 3dtile 数据,用来测试环境 OSGB 数据下载 OSGB 格式数 ...
倾斜摄影数据转cesium 3dtile（详细步骤）
项目新需求,需要在地图上展示3d实景模型,折腾了几天,效果还不错,分享给被cesium折磨的小伙伴倾斜摄影图片(jpg)转cesium 3dtiles 并展示步骤: 原始照片 -> Cont ...
Cesium 之加载倾斜摄影3d模型（解决倾斜漂移问题）
以Cesium3DTileset方式加载服务发布的倾斜摄影静态资源Json文件,参考如下: item.url='倾斜摄影的json地址/tileset.json'; let tileset = win ...
非专业无人机进行倾斜摄影并且通过cesium加载
非专业无人机进行倾斜摄影并且通过cesium加载前言一.大疆御2Pro无人机操作二.contextCapture进行数据处理三.cesium加载倾斜摄影模型总结前言大多数倾斜摄影都是用大 ...
Vue3.0+Cesium+Tomcat服务下倾斜摄影数据加载详细过程
Vue3.0+Cesium+Tomcat服务下倾斜摄影数据加载 1.Vue-cli 3.0 + cesium 构建参考资料地址Vue-cli 3.0 + cesium 构建注意,因为文档中设置默认 ...
使用开源Cesium+Vue实现倾斜摄影三维展示
准备工作 VUE开发工具:Visual studio Code 倾斜摄影转换工具:CesiumLab-下载地址:Cesium实验室官网三维显示:Cesium,api参考网站:Camera - Ces ...
Cesium开发及离线加载倾斜摄影
前言前段时间接手了一个任务,让我研究一下开源的地图引擎,可以加载倾斜摄影数据,展示3D效果,实现地图应该有的大部分功能~好吧,我听到时真是一头雾水.WTF?地图引擎?3D模型?倾斜摄影?这都是什么鬼 ...

cesium倾斜摄影

cesium倾斜摄影

加载与定位

位置调整（先调整后加载）

位置调整（先加载后调整）

cesium倾斜摄影相关推荐

最新文章

热门文章