作者:CSDN @ _乐多_
文章目录
一、packages/engine和packages/widgets区别
在 Cesium 中,packages/engine 和 packages/widgets 是两个不同的模块,它们提供了不同的功能和用途。
- packages/engine:
- 该模块包含了 Cesium 的核心引擎部分,用于构建和渲染 3D 场景。
- 这个模块提供了 Cesium 的主要功能,包括地球和其他天体的渲染、相机控制、几何体创建、地形渲染、光照效果、场景渲染优化等。
- 通常,当你需要在你的应用程序中创建一个 3D 场景,并对场景的细节进行更多的控制时,你会使用 packages/engine 模块。
- packages/widgets:
- 该模块包含了 Cesium 的用户界面小部件(widgets),用于在场景中添加交互式的用户界面元素。
- 这个模块提供了一系列方便的小部件,如工具栏、地图导航控件(zoom、compass、home button 等)、信息框、时间轴、图例等,用于增强用户体验和场景的交互性。
- 使用这些小部件,你可以快速地为场景添加常见的交互功能,而无需手动编写复杂的用户界面代码。
- 如果你想在你的场景中添加一些交互式的用户界面元素,你可以使用 packages/widgets 模块。
综上所述,packages/engine 是用于构建和渲染 3D 场景的核心引擎模块,而 packages/widgets 是用于添加交互式用户界面小部件的模块。在使用 Cesium 进行开发时,你通常会同时使用这两个模块,以获得完整的 3D 场景展示和用户交互的功能。
二、packages/engine
三、packages/widgets
3.1 Cesium.Viewer是什么
Cesium.Viewer 是 Cesium API 中的一个构造函数,用于创建一个 Cesium 场景的可视化窗口。它提供了一个交互式的地球场景,可以在其中显示各种地球数据、实体、模型、图层等,并且支持用户与场景进行交互操作。
Cesium.Viewer 的构造函数定义如下:
new Cesium.Viewer(container, options);
参数说明:
- container: 必需参数。表示容纳 Cesium 场景的 HTML 元素,可以是 div、canvas 等元素的 ID 或 DOM 对象。
- options: 可选参数。一个包含各种选项的对象,用于自定义 Cesium 场景的行为和外观。这个参数是一个包含键值对的对象,可以设置各种属性来配置 Cesium 场景。
常见的 options 参数属性如下:
- animation: 控制是否显示动画小部件。默认值为 true。
- baseLayerPicker: 控制是否显示基础图层选择器小部件。默认值为 true。
- fullscreenButton: 控制是否显示全屏按钮小部件。默认值为 true。
- vrButton: 控制是否显示虚拟现实按钮小部件。默认值为 false。
- homeButton: 控制是否显示返回初始视图按钮小部件。默认值为 true。
- infoBox: 控制是否显示信息框小部件。默认值为 true。
- sceneMode: 控制场景的初始模式,可以是 Cesium.SceneMode.SCENE2D、Cesium.SceneMode.SCENE3D 或 Cesium.SceneMode.COLUMBUS_VIEW。
- terrainProvider: 控制地形提供者,用于加载和显示地球表面的地形数据。
- imageryProvider: 控制图像提供者,用于加载和显示地球表面的图像数据。
- skyBox: 控制场景中的天空盒,用于显示天空的背景。
- clock: 一个 Cesium.Clock 对象,用于控制场景中的时间和动画。
这里列出的只是一部分常用的选项,实际上 Cesium.Viewer 支持的选项非常丰富,可以根据需要进行更多的配置和定制。
示例用法:
const viewer = new Cesium.Viewer("cesiumContainer", {
animation: false,
baseLayerPicker: false,
fullscreenButton: false,
homeButton: false,
imageryProvider: new Cesium.UrlTemplateImageryProvider({
url: "https://.../{z}/{x}/{y}.jpg",
}),
});
上述示例中,创建了一个名为 viewer 的 Cesium 场景实例,场景将显示在 ID 为 “cesiumContainer” 的 HTML 元素中。还设置了一些选项来自定义场景的行为,如禁用动画、禁用基础图层选择器和全屏按钮,并使用一个图像提供者来加载地球表面的图像数据。
3.2 viewer.zoomTo(viewer.entities)
viewer.zoomTo(viewer.entities) 是 Cesium API 中的一个方法调用,它的作用是将场景中的所有实体(entities)调整到合适的视角,从而完整地显示所有的实体。
在 Cesium 中,实体(entities)是用于在场景中表示各种物体或元素的对象,可以是点、线、面、模型等。viewer.entities 是一个 Cesium.Viewer 实例的属性,表示场景中的所有实体对象的集合。
当调用 viewer.zoomTo(viewer.entities) 方法时,Cesium 会自动计算所有实体的边界范围,然后调整视角,以确保所有实体都在当前视口内可见,并且尽可能填充整个视口。这样,你就可以看到场景中的所有实体,而无需手动调整视角或缩放。
这个方法特别适用于当场景中有多个实体,且它们的位置分布较广,你希望一次性将它们全部显示出来时。它可以节省你手动调整视角的时间,使场景中的所有内容都一目了然。
3.3 Cesium.Cartesian3.fromDegrees(113.802689907, 35.373933211, 0.00000))
Cesium.Cartesian3.fromDegrees 是 Cesium API 中的一个方法,用于将经度(longitude)、纬度(latitude)和高度(height)的坐标值转换为 Cesium 中的 Cartesian3 坐标。
在 Cesium 中,Cartesian3 是表示三维空间中点的对象,它由三个浮点数值(x、y、z)表示。经度和纬度通常用于表示地球上的位置,而高度用于表示相对于地球表面的高度。
这个方法的语法是:
Cesium.Cartesian3.fromDegrees(longitude, latitude, height);
其中:
- longitude 表示经度值,用于指定点在地球上的经度位置,单位为度。
- latitude 表示纬度值,用于指定点在地球上的纬度位置,单位为度。
- height 表示高度值,用于指定点相对于地球表面的高度,单位为米。
使用该方法可以将经度、纬度和高度的坐标值转换为 Cesium 的 Cartesian3 坐标,以便在 Cesium 场景中定位和显示相应的点。在你提供的例子中,代码将经度 113.802689907、纬度 35.373933211 和高度 0.00000 转换为 Cesium 的 Cartesian3 坐标。
声明:
本人作为一名作者,非常重视自己的作品和知识产权。在此声明,本人的所有原创文章均受版权法保护,未经本人授权,任何人不得擅自公开发布。
本人的文章已经在一些知名平台进行了付费发布,希望各位读者能够尊重知识产权,不要进行侵权行为。任何未经本人授权而将付费文章免费或者付费(包含商用)发布在互联网上的行为,都将视为侵犯本人的版权,本人保留追究法律责任的权利。
谢谢各位读者对本人文章的关注和支持!