三维应用开发及示例.pdf

1、三维应用开发及示例易智瑞信息技术有限公司张迪三维模型的加载与展示即拿即用的微件示例展示场景的优化策略02010304三维模型的加载 API引入方式通过 CDN 使用 AMD 模块:异步加载，无需打包，项目运行时在html中挂载script标签，直接获取部署在服务器上的API。对比ES模块的加载方式较为简单，可快速开始开发，目前推荐demo级或者轻量的应用开发使用。（向前兼容4.X API的项目）通过 NPM 使用 ES 模块:通过npm下载依赖到本地，接入webpack等打包工具，引入编译、压缩和单元测试等功能，享受更丰富现代的JS或TS语法支持，适合规模更大，更复杂的应用开发场景。三维模型的

2、加载 API引入方式通过 CDN 使用 ES 模块：该方法要注意，需要浏览器支持使用 CDN 来加载 ES 模块的特性。因此，要确保目标浏览器支持 ES 模块并且版本较新。（仅建议将此方法用于开发和原型设计）本地托管的 AMD 模块：在某些情况下，可能需要使用GeoScene API AMD 模块的本地托管版本。例如，在没有互联网接入的受限网络环境中工作时。本地托管的 AMD 模块：在官网下载API类库包，然后将API部署到本地，即可离线使用。API部署:将API包解压后放到Web Server(IIS的wwwroot或Tomcat的webapps)下IIS服务器HTTP响应标头配置如图所示:

3、三维模型的加载 API引入方式三维模型的加载 基础元素JS API构建Web三维应用的基础元素数据层：Map、Layers展示层：SceneView、Camera三维模型的加载 Maps新JS API MVVM架构下，数据层和视图层是完全分离的，Map作为一个数据层的容器，负责数据管理，管理所有的图层。最终需要通过视图展示它。Map类管理图层的属性与方法：属性属性方法方法basemap：底图，Basemap类型ground：地形与高程信息，Ground类型allLayers：所有图层的集合，Collection类型layers：具体业务图层，Coolection类型add()：添加一个图层，可

4、指定图层位置addMany()：添加多个图层，可指定位置findLayerById()：根据ID寻找图层remove()：移除指定图层removeAll()：移除全部图层removeMany()：移除多个图层reorder()：对某个图层进行重排序（id变换）三维模型的加载 Layers图层是可在Map中使用的数据集合，JS API支持多种类型的图层(多种类型的数据源）构建一个三维应用常用的数据：精模精模（SceneLayerSceneLayer）BIMBIM（BuildingLayeBuildingLayer r）倾斜摄影数据倾斜摄影数据（IntegratedMeshLayeIntegrat

5、edMeshLayer r）点云点云（PointCloudLayePointCloudLayer r）体元体元（VoxelLayerVoxelLayer）适合手工精细建模数据，如3dsMax生产出来的数据。BIM数据无人机倾斜摄影数据激光雷达获取的点云数据体元数据支持renderer支持renderer支持部分（不）展示支持renderer支持部分（不）展示支持popup支持popup支持压平不支持popup支持popup支持querying支持querying不支持renderer不支持querying不支持querying不支持popup不支持querying三维模型的加载 ViewsVi

6、ew主要作用是渲染图层、图层弹窗和微件，处理用户交互。在三维应用中，使用基于浏览器WebGL技术的SceneView,来渲染3D视图。SceneView提供了两种展示地球形态的方式:global模式将地球描述为球体，其通过WebMercator、GCS2000 或者 WGS84空间投影来创建；允许显示整个地球场景；可以浏览地下（Ground.navigationConstraint.type设置为none）。local模式将地球描述为一个平面，可以通过任何坐标系来创建；显示局部场景；可以浏览地下。三维模型的展示 Camera创建 SceneView 时，它包含一个相机属性。相机定义了观察场景视