Cesium开发:模拟建筑楼板数据

简介: Cesium开发:模拟建筑楼板数据

多层的建筑体,在不需要精确的模型效果时,使用Cesium的Polygon去模拟每层楼的楼板效果,设定每层楼的高度和楼层的总数,生成CZML文件,批量加载楼板的数据。
根据Cesium的api,加载一个带高度拉起效果的polygon,使用以下的代码:

var greenPolygon = viewer.entities.add({
   
   

name : 'Green extruded polygon',

polygon : {
   
   

hierarchy : Cesium.Cartesian3.fromDegreesArray([-108.0, 42.0,

-100.0, 42.0,

-104.0, 40.0]),

height:50000,

extrudedHeight: 100000.0,

material : Cesium.Color.GREEN 
}

});

其中设置的height和extrudedHeight是关键参数,height标示polygon离地的高度,extrudedHeight是polygon的拉高高度,根据楼层高度,设置每层的height,在加上楼层高度,设置extrudedHeight,到达分层的楼板效果。
CZML数据节点的编辑如下:


{
   
   

"id":"floor_0",

"name":"floors"

,"polygon":

{
   
   "positions":

{
   
   "cartographicDegrees":[坐标数组]},

"material":

{
   
   

"solidColor":

{
   
   "color":

{
   
   "rgba":[255,255,255,120]}

}

},

//离地高度设置

"height":0,

//拉高高度设置

"extrudedHeight":4.6,"

outline":true}

}

使用js或者其他代码,循环根据楼层数和高度进行遍历,生成最终的CZML数据。

以下是简单楼板显示效果,加上鼠标移动时的选中效果:
image.png

相关文章
|
监控 数据可视化 安全
如何使用webgl(three.js)实现煤矿隧道、井下人员定位、掘进面、纵采面可视化解决方案——第十九课(一)
three.js、webgl、3D煤矿隧道、三维井下人员定位、掘进面三维可视化、纵采面可视化、采集面可视化展示、设备检测、数字孪生、物联网3D、3d建筑、3d库房,bim管理系统
317 1
|
数据可视化 搜索推荐 前端开发
漏刻有时数据可视化Echarts组件开发(16):乡镇街道下辖村级或社区级别的行政区域边界轮廓划分的svg解决方案
漏刻有时数据可视化Echarts组件开发(16):乡镇街道下辖村级或社区级别的行政区域边界轮廓划分的svg解决方案
319 0
|
2月前
|
JavaScript
ThreeJs绘制数字孪生仓库场景
这篇文章介绍了使用Three.js来构建一个数字孪生仓库的3D场景,包括创建地板和墙壁的基础步骤,并提供了相应的代码实现细节。
100 0
ThreeJs绘制数字孪生仓库场景
|
数据可视化 前端开发 JavaScript
3分钟,教你搭建一个三维城市建筑可视化系统 ( Cesium 加载 shp 数据 )
3分钟,教你搭建一个三维城市建筑可视化系统 ( Cesium 加载 shp 数据 )
3652 0
3分钟,教你搭建一个三维城市建筑可视化系统 ( Cesium 加载 shp 数据 )
|
算法 索引
【D3.js - v5.x】(5)绘制力导向图 | 附完整代码
【D3.js - v5.x】(5)绘制力导向图 | 附完整代码
803 0
【D3.js - v5.x】(5)绘制力导向图 | 附完整代码
|
存储 JSON 数据可视化
ChatGPT工作提效之数据可视化大屏组件Echarts的实战方案(大数据量加载、伪3D饼图、地图各省cp中心坐标属性、map3D材质)
ChatGPT工作提效之数据可视化大屏组件Echarts的实战方案(大数据量加载、伪3D饼图、地图各省cp中心坐标属性、map3D材质)
654 0
|
定位技术
Cesium开发:二三维联动
Cesium开发:二三维联动
1310 0
|
数据可视化 物联网
Threejs物联网,工厂3D可视化,加载模型,水流监测,标签动态数据展示
Threejs物联网,工厂3D可视化,加载模型,水流监测,标签动态数据展示
962 15
Threejs物联网,工厂3D可视化,加载模型,水流监测,标签动态数据展示
|
数据可视化 物联网 程序员
使用webgl(three.js)搭建一个3D智慧园区、3D建筑,3D消防模拟,web版3D,bim管理系统——第四课(炫酷版一)
3d建筑,3d消防,消防演习模拟,3d库房,3d档案室,3d密集架,webGL,threejs,3d机房,bim管理系统
5739 0
|
前端开发 JavaScript
Threejs 创建一个虚拟城市三维场景
Threejs 创建一个虚拟城市三维场景
1032 0
Threejs 创建一个虚拟城市三维场景