用于构建应用程序的基本小部件。它将所有标准cesium组件组合到一个可重用的包中。
小部件总是可以通过使用mixins来扩展,它可以添加对各种应用程序有用的功能。
Name | Type | Description |
---|---|---|
container |
Element | string | 将包含小部件的DOM元素或ID。 |
options |
Viewer.ConstructorOptions | optional 描述初始化选项的对象 |
Throws:
-
DeveloperError : id为"container"的元素在文档中不存在。
-
DeveloperError : options.selectedImageryProviderViewModel 在不使用BaseLayerPicker小部件时不可用,请指定选项。baseLayer相反.
-
DeveloperError : options.selectedTerrainProviderViewModel 在不使用BaseLayerPicker小部件时不可用,请指定选项。terrainProvider相反.
Example:
// Initialize the viewer widget with several custom options and mixins.
try {
const viewer = new Cesium.Viewer("cesiumContainer", {
// Start in Columbus Viewer
sceneMode: Cesium.SceneMode.COLUMBUS_VIEW,
// Use Cesium World Terrain
terrain: Cesium.Terrain.fromWorldTerrain(),
// Hide the base layer picker
baseLayerPicker: false,
// Use OpenStreetMaps
baseLayer: new Cesium.ImageryLayer(new Cesium.OpenStreetMapImageryProvider({
url: "https://tile.openstreetmap.org/"
})),
skyBox: new Cesium.SkyBox({
sources: {
positiveX: "stars/TychoSkymapII.t3_08192x04096_80_px.jpg",
negativeX: "stars/TychoSkymapII.t3_08192x04096_80_mx.jpg",
positiveY: "stars/TychoSkymapII.t3_08192x04096_80_py.jpg",
negativeY: "stars/TychoSkymapII.t3_08192x04096_80_my.jpg",
positiveZ: "stars/TychoSkymapII.t3_08192x04096_80_pz.jpg",
negativeZ: "stars/TychoSkymapII.t3_08192x04096_80_mz.jpg"
}
}),
// Show Columbus View map with Web Mercator projection
mapProjection: new Cesium.WebMercatorProjection()
});
} catch (error) {
console.log(error);
}
// Add basic drag and drop functionality
viewer.extend(Cesium.viewerDragDropMixin);
// Show a pop-up alert if we encounter an error when processing a dropped file
viewer.dropError.addEventListener(function(dropHandler, name, error) {
console.log(error);
window.alert(error);
});
Demo:
See:
Members
获取或设置是否数据源可以暂时暂停
动画,以避免显示一个不完整的图片给用户。
例如,如果异步原语正在处理
背景,时钟将不会前进,直到几何就绪。
readonly animation : Animation
获取 Animation widget.
readonly baseLayerPicker : BaseLayerPicker
获取 BaseLayerPicker.
控件所在窗口底部区域的DOM元素
CreditDisplay
还有其他潜在的问题。
readonly camera : Camera
获取 camera.
获取 canvas.
readonly cesiumWidget : CesiumWidget
获取CesiumWidget。
readonly clock : Clock
获取 clock.
clockTrackedDataSource : DataSource
获取或设置数据源与观众的时钟跟踪。
readonly clockViewModel : ClockViewModel
获取时钟视图模型。
获取父容器。
creditDisplay : CreditDisplay
管理要在屏幕和灯箱中显示的积分列表。
readonly dataSourceDisplay : DataSourceDisplay
获取用于
DataSource
可视化的显示。
readonly dataSources : DataSourceCollection
获取 要可视化的
DataSource
实例集。
readonly ellipsoid : Ellipsoid
获取场景的默认椭球。
-
Default Value:
Ellipsoid.default
readonly entities : EntityCollection
获取没有绑定到特定数据源的实体集合。
这是一个捷径
dataSourceDisplay.defaultDataSource.entities
.
readonly fullscreenButton : FullscreenButton
获取 FullscreenButton.
readonly geocoder : Geocoder
获取 Geocoder.
readonly homeButton : HomeButton
获取 HomeButton.
readonly imageryLayers : ImageryLayerCollection
获取 将在地球仪上渲染的图像层集合。
readonly infoBox : InfoBox
获取 info box.
readonly navigationHelpButton : NavigationHelpButton
获取 NavigationHelpButton.
readonly postProcessStages : PostProcessStageCollection
获取 post-process stages.
readonly projectionPicker : ProjectionPicker
获取 ProjectionPicker.
获取或设置渲染分辨率的缩放因子。值小于1.0可以改善
性能在较弱的设备上,而值大于1.0将以更高的渲染
分辨率,然后按比例缩小,从而提高视觉保真度。
例如,如果小部件的尺寸为640x480,则将此值设置为0.5
将导致场景以320x240渲染,然后在设置时缩放
它到2.0将导致场景渲染为1280x960,然后缩小。
-
Default Value:
1.0
readonly scene : Scene
得到场景.
readonly sceneModePicker : SceneModePicker
得到场景ModePicker.
readonly screenSpaceEventHandler : ScreenSpaceEventHandler
获取 screen space event handler.
selectedEntity : Entity|undefined
获取或设置对象实例,为其显示选择指示符。
如果用户交互选择一个cesium3dtiesfeature实例,那么这个属性
将包含一个瞬态实体实例,其属性名为“feature”
被选中的实例。
readonly selectedEntityChanged : Event
所选实体更改时引发的获取事件。
readonly selectionIndicator : SelectionIndicator
获取选择指示符。
readonly shadowMap : ShadowMap
获取场景的阴影贴图
确定阴影是否由光源投射。
获取或设置当
useDefaultRenderLoop
时小部件的目标帧率
为true。如果未定义,则浏览器的requestAnimationFrame实现
决定帧速率。如果已定义,则此值必须大于0。一个更高的值
底层的requestAnimationFrame实现将没有效果。
terrainProvider : TerrainProvider
地形提供程序,为地球仪提供表面几何形状。
terrainShadows : ShadowMode
确定地形投射或光源的阴影。
readonly timeline : Timeline
获取 Timeline widget.
trackedEntity : Entity|undefined
获取或设置当前被摄像机跟踪的实体实例。
readonly trackedEntityChanged : Event
当跟踪的实体发生变化时引发的获取事件。
布尔标志,表示是否使用浏览器推荐的分辨率。
如果为true,浏览器的设备像素比将被忽略,而使用1.0。
有效地渲染基于CSS像素而不是设备像素。这可以改善
性能较弱的设备,具有高像素密度。当为false时,渲染
的单位是设备像素。
Viewer#resolutionScale
仍然会生效
这个标志是真还是假。
-
Default Value:
true
获取或设置是否这个小部件应该控制渲染循环。
如果为true,小部件将使用requestAnimationFrame
执行渲染和调整小部件的大小,以及驱动
模拟时钟。如果设置为false,则必须手动调用
resize
, render
方法
作为自定义渲染循环的一部分。如果渲染过程中出现错误,Scene
renderError
事件将被引发
将被设置为false。必须将其设置为true才能继续渲染
后的错误。
readonly vrButton : VRButton
获取 VRButton.
Methods
销毁小部件。如果从布局中永久删除小部件,
则应该调用。
使用提供的mixin扩展基本查看器功能。
mixin可以添加额外的属性、函数或其他行为
到所提供的查看器实例。
Name | Type | Description |
---|---|---|
mixin |
Viewer.ViewerMixin | 要添加到此实例的Viewer mixin。 |
options |
object | optional 要传递给mixin函数的options对象。 |
See:
将相机飞到提供的实体、实体或数据源。
如果数据源仍在加载过程中或可视化仍在加载中,
这个方法在执行飞行之前等待数据准备好。
偏移量是在以边界球中心为中心的本地东-北-上参考系中的头部/俯仰/范围。 航向和俯仰角在当地的东-北-上参考系中定义。 航向是从y轴到x轴增加的角度。螺距是x平面的旋转。积极的推销 个角在平面的上方。负俯仰角在平面以下。距离是到中心的距离。如果范围是 0,计算一个范围,使整个边界球可见。
在2D中,必须有一个自上而下的视图。摄像机将放置在目标上方向下看。高于地面的高度 目标将是范围。标题将根据偏移量确定。如果标题不能 由偏移量决定,标题将向北。
Name | Type | Description | ||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
target |
Entity | Array.<Entity> | EntityCollection | DataSource | ImageryLayer | Cesium3DTileset | TimeDynamicPointCloud | Promise.<(Entity|Array.<Entity>|EntityCollection|DataSource|ImageryLayer|Cesium3DTileset|TimeDynamicPointCloud|VoxelPrimitive)> | 要查看的实体、实体数组、实体集合、数据源、Cesium3DTileset、点云或图像层。您还可以传递一个承诺,该承诺解析为前面提到的类型之一。 | ||||||||||||||||
options |
object |
optional
对象,具有以下属性:
|
Returns:
一个Promise,如果飞行成功,则解析为true;如果当前场景中没有显示目标或航班被取消,则解析为false。 //TODO: Cleanup entity mentions
这迫使小部件重新考虑其布局,包括
小部件大小和信用位置。
Returns:
如果对象已被销毁,则为true,否则为false。
渲染场景。这个函数是自动调用的
除非
useDefaultRenderLoop
设置为false;
调整小部件的大小以匹配容器的大小。
此函数在需要时自动调用,除非
useDefaultRenderLoop
设置为false。
异步设置相机查看提供的实体、实体或数据源。
如果数据源仍在加载过程中或可视化仍在加载中,
这个方法在执行缩放之前等待数据准备好。
偏移量是在以边界球中心为中心的本地东-北-上参考系中的头部/俯仰/范围。 航向和俯仰角在当地的东-北-上参考系中定义。 航向是从y轴到x轴增加的角度。螺距是x平面的旋转。积极的推销 个角在平面的上方。负俯仰角在平面以下。距离是到中心的距离。如果范围是 0,计算一个范围,使整个边界球可见。
在2D中,必须有一个自上而下的视图。摄像机将放置在目标上方向下看。高于地面的高度 目标将是范围。标题将根据偏移量确定。如果标题不能 由偏移量决定,标题将向北。
Name | Type | Description |
---|---|---|
target |
Entity | Array.<Entity> | EntityCollection | DataSource | ImageryLayer | Cesium3DTileset | TimeDynamicPointCloud | Promise.<(Entity|Array.<Entity>|EntityCollection|DataSource|ImageryLayer|Cesium3DTileset|TimeDynamicPointCloud|VoxelPrimitive)> | 要查看的实体、实体数组、实体集合、数据源、Cesium3DTileset、点云或图像层。您还可以传递一个承诺,该承诺解析为前面提到的类型之一。 |
offset |
HeadingPitchRange | optional 在本地east-north-up参考系中与实体中心的偏移量。 |
Returns:
一个Promise,如果缩放成功,则解析为true;如果当前场景中没有显示目标或缩放被取消,则解析为false。
Type Definitions
查看器构造函数的初始化选项
Properties:
Name | Type | Attributes | Default | Description |
---|---|---|---|---|
animation |
boolean |
<optional> |
true | 如果设置为 false,则不会创建 Animation 微件。 |
baseLayerPicker |
boolean |
<optional> |
true | 如果设置为 false,则不会创建 BaseLayerPicker 小组件。 |
fullscreenButton |
boolean |
<optional> |
true | 如果设置为 false,则不会创建 FullscreenButton 小组件。 |
vrButton |
boolean |
<optional> |
false | 如果设置为 true,则将创建 VRButton 小部件。 |
geocoder |
boolean | IonGeocodeProviderType | Array.<GeocoderService> |
<optional> |
IonGeocodeProviderType.DEFAULT | 使用 Geocoder 微件进行搜索时要使用的一个或多个地理编码服务。如果设置为 false,则不会创建 Geocoder 小组件。 |
homeButton |
boolean |
<optional> |
true | 如果设置为 false,则不会创建 HomeButton 小组件。 |
infoBox |
boolean |
<optional> |
true | 如果设置为 false,则不会创建 InfoBox 微件。 |
sceneModePicker |
boolean |
<optional> |
true | 如果设置为 false,则不会创建 SceneModePicker 小部件。 |
selectionIndicator |
boolean |
<optional> |
true | 如果设置为 false,则不会创建 SelectionIndicator 小组件。 |
timeline |
boolean |
<optional> |
true | 如果设置为 false,则不会创建 Timeline 构件。 |
navigationHelpButton |
boolean |
<optional> |
true | 如果设置为 false,则不会创建导航帮助按钮。 |
navigationInstructionsInitiallyVisible |
boolean |
<optional> |
true | 如果导航说明最初应可见,则为 True,如果在用户明确单击按钮之前不应显示,则为 false。 |
scene3DOnly |
boolean |
<optional> |
false | 如果为 true ,则每个几何实例将仅以 3D 形式渲染以节省 GPU 内存。 |
shouldAnimate |
boolean |
<optional> |
false | true 如果 clock 默认应尝试提前 Simulation time,否则为 false 。 此选项优先于设置 Viewer#clockViewModel 。 |
clockViewModel |
ClockViewModel |
<optional> |
new ClockViewModel(clock) | 用于控制当前时间的 clock view 模型。 |
selectedImageryProviderViewModel |
ProviderViewModel |
<optional> |
当前基础影像图层的视图模型(如果未提供),则使用第一个可用的基础图层。 仅当 'baseLayerPicker' 设置为 true 时,此值才有效。 | |
imageryProviderViewModels |
Array.<ProviderViewModel> |
<optional> |
createDefaultImageryProviderViewModels() | 可从 BaseLayerPicker 中选择的 ProviderViewModel 数组。 仅当 'baseLayerPicker' 设置为 true 时,此值才有效。 |
selectedTerrainProviderViewModel |
ProviderViewModel |
<optional> |
当前基础地形图层的视图模型(如果未提供,则使用第一个可用的基础图层)。 仅当 'baseLayerPicker' 设置为 true 时,此值才有效。 | |
terrainProviderViewModels |
Array.<ProviderViewModel> |
<optional> |
createDefaultTerrainProviderViewModels() | 可从 BaseLayerPicker 中选择的 ProviderViewModel 数组。 仅当 'baseLayerPicker' 设置为 true 时,此值才有效。 |
baseLayer |
ImageryLayer | false |
<optional> |
ImageryLayer.fromWorldImagery() | 应用于地球的最底部影像图层。如果设置为 false ,则不会添加任何影像提供程序。仅当 'baseLayerPicker' 设置为 false 时,此值才有效。当 'globe' 设置为 false 时不能使用。 |
ellipsoid |
Ellipsoid |
<optional> |
Ellipsoid.default | 默认椭球体。 |
terrainProvider |
TerrainProvider |
<optional> |
new EllipsoidTerrainProvider() | 要使用的 terrain 提供程序 |
terrain |
Terrain |
<optional> |
一个处理异步 terrain 提供程序的 terrain 对象。只能指定 options.terrainProvider 为 undefined 时。 | |
skyBox |
SkyBox | false |
<optional> |
用于渲染星星的天空盒。如果undefined 且使用 WGS84 椭球体,则使用默认星形。如果设置为 false ,则不会添加 skyBox、Sun 或 Moon。 |
|
skyAtmosphere |
SkyAtmosphere | false |
<optional> |
蓝天,以及地球边缘周围的光芒。在使用 WGS84 椭球体时启用。设置为 false 可将其关闭。 |
|
fullscreenElement |
Element | string |
<optional> |
document.body | 按下全屏按钮时要置于全屏模式的元素或 ID。 |
useDefaultRenderLoop |
boolean |
<optional> |
true | 如果此小部件应控制渲染循环,则为 True,否则为 false。 |
targetFrameRate |
number |
<optional> |
使用默认渲染循环时的目标帧速率。 | |
showRenderLoopErrors |
boolean |
<optional> |
true | 如果为 true,则如果发生渲染循环错误,此小组件将自动向用户显示包含错误的 HTML 面板。 |
useBrowserRecommendedResolution |
boolean |
<optional> |
true | 如果为 true,则以浏览器建议的分辨率渲染并忽略 window.devicePixelRatio 。 |
automaticallyTrackDataSourceClocks |
boolean |
<optional> |
true | 如果为 true,则此小部件将自动跟踪新添加的 DataSource 的 clock 设置,并在 DataSource 的 clock 更改时更新。 如果要独立配置 clock ,请将其设置为 false 。 |
contextOptions |
ContextOptions |
<optional> |
传递给 Scene 的 Context 和 WebGL 创建属性。 |
|
sceneMode |
SceneMode |
<optional> |
SceneMode.SCENE3D | 初始场景模式。 |
mapProjection |
MapProjection |
<optional> |
new GeographicProjection(options.ellipsoid) | 在 2D 和 Columbus View 模式下使用的地图投影。 |
globe |
Globe | false |
<optional> |
new Globe(options.ellipsoid) | 要在场景中使用的地球仪。 如果设置为 false ,则不会添加地球仪,并且默认情况下将隐藏天空大气。 |
orderIndependentTranslucency |
boolean |
<optional> |
true | 如果 true 且配置支持,则使用顺序无关的半透明。 |
creditContainer |
Element | string |
<optional> |
将包含 CreditDisplay 的 DOM 元素或 ID。 如果未指定,则积分将添加到小组件本身的底部。 |
|
creditViewport |
Element | string |
<optional> |
将包含由 CreditDisplay 创建的信用弹出窗口的 DOM 元素或 ID。 如果未指定,它将出现在 widget 本身上。 |
|
dataSources |
DataSourceCollection |
<optional> |
new DataSourceCollection() | 小组件可视化的数据源集合。 如果提供此参数,则 假定该实例归调用方所有,并且在销毁查看器时不会销毁。 |
shadows |
boolean |
<optional> |
false | 确定阴影是否由光源投射。 |
terrainShadows |
ShadowMode |
<optional> |
ShadowMode.RECEIVE_ONLY | 确定地形是投射还是接收来自光源的阴影。 |
mapMode2D |
MapMode2D |
<optional> |
MapMode2D.INFINITE_SCROLL | 确定 2D 贴图是可旋转的还是可以在水平方向上无限滚动的。 |
projectionPicker |
boolean |
<optional> |
false | 如果设置为 true,则将创建 ProjectionPicker 小部件。 |
blurActiveElementOnCanvasFocus |
boolean |
<optional> |
true | 如果为 true,则单击查看器的画布时,活动元素将模糊。如果单击画布仅用于检索位置或实体数据,而实际上没有将画布设置为活动元素,则将其设置为 false 非常有用。 |
requestRenderMode |
boolean |
<optional> |
false | 如果为 true,则仅在需要时渲染帧,具体取决于场景中的变化。启用此选项可降低应用程序的 CPU/GPU 使用率,并减少移动设备上的电池消耗,但需要使用 Scene#requestRender 在此模式下显式渲染新帧。在 API 的其他部分对场景进行更改后,这在许多情况下是必需的。参见 通过显式渲染提高性能。 |
maximumRenderTimeChange |
number |
<optional> |
0.0 | 如果 requestRenderMode 为 true,则此值定义在请求渲染之前允许的模拟时间的最大变化。参见 通过显式渲染提高性能。 |
depthPlaneEllipsoidOffset |
number |
<optional> |
0.0 | 调整 DepthPlane 以解决低于椭球零高程的渲染伪影。 |
msaaSamples |
number |
<optional> |
4 | 如果提供,此值将控制多重采样抗锯齿的速率。典型的多重采样率为每像素 2 个、4 个样本,有时甚至 8 个样本。较高的 MSAA 采样率可能会影响性能,以换取提高的视觉质量。此值仅适用于支持多重采样渲染目标的 WebGL2 上下文。设置为 1 可禁用 MSAA。如果提供,此值将控制多重采样抗锯齿的速率。典型的多重采样率为每像素 2 个、4 个样本,有时甚至 8 个样本。较高的 MSAA 采样率可能会影响性能,以换取提高的视觉质量。此值仅适用于支持多重采样渲染目标的 WebGL2 上下文。设置为 1 可禁用 MSAA。 |
为查看器实例增加附加功能的函数。
Name | Type | Description |
---|---|---|
viewer |
Viewer | 查看器实例。 |
options |
object | 要传递给mixin函数的Options对象。 |