Cesium自动生成建筑物3D轮廓模型

Cesium提供方法自动生成建筑物3D模型,也就是根据地面上的图片,建筑物的周围轮廓生成一个模拟的3D建筑物的轮廓,并放置在地球的建筑物位置,相关注释在代码中已经体现了。下面通过代码演示整个过程:

html/xml 复制代码
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <!-- Include the CesiumJS JavaScript and CSS files -->
  <script src="https://cesium.com/downloads/cesiumjs/releases/1.100/Build/Cesium/Cesium.js"></script>
  <link href="https://cesium.com/downloads/cesiumjs/releases/1.100/Build/Cesium/Widgets/widgets.css" rel="stylesheet">
</head>
<body>
  <div id="cesiumContainer"></div>
  <script>
    // 设置token
    Cesium.Ion.defaultAccessToken = 'token';

    // 初始化一个id为 `cesiumContainer`的HTML元素作为我们的容器,这里不传ID传DO .
    const viewer = new Cesium.Viewer('cesiumContainer', {});    
	
    // 加载OSM建筑,也就是一些城市的白膜建筑,只有形状没有纹理的模型.
    const buildingTileset = viewer.scene.primitives.add(Cesium.createOsmBuildings());   
    //飞入到某个点查看
    viewer.camera.flyTo({
      destination : Cesium.Cartesian3.fromDegrees(-122.4175, 37.655, 400),
      orientation : {
        heading : Cesium.Math.toRadians(0.0),
        pitch : Cesium.Math.toRadians(-15.0),
      }
    });
  </script>
 </div>
</body>
</html>

效果图 以上如有问题可以在评论区留言

相关推荐
图生生6 小时前
基于AI的电商产品2D转3D,降低3D建模开发成本
3d·ai
mocoding17 小时前
Flutter 3D 翻转动画flip_card三方库在鸿蒙版天气预报卡片中的实战教程
flutter·3d·harmonyos
2501_948120151 天前
3D虚拟衣服动画系统关键技术的研究与实现
3d
应用市场1 天前
基于上下文感知分层深度修复的3D照片生成技术详解
3d
你好!蒋韦杰-(烟雨平生)1 天前
OpenGL
c++·数学·游戏·3d
星幻元宇VR1 天前
消防安全教育展厅设备|消防器材装备3D展示系统
安全·3d·虚拟现实
山楂树の1 天前
3D渲染分层机制 Layers 的原理分析(Threejs)
数据结构·3d·相机
应用市场1 天前
【自动驾驶感知】基于3D部件引导的图像编辑:细粒度车辆状态理解技术详解
人工智能·3d·自动驾驶
EliseL2 天前
SuperMap iObjects Java 如何将3DTiles数据转换为S3M三维瓦片
java·3d·三维
qq_532453532 天前
使用 GaussianSplats3D 在 Vue 3 中构建交互式 3D 高斯点云查看器
前端·vue.js·3d