麻辣GIS微信平台

更多 GIS 干货

微信关注不错过

Cesium API - Viewer 中文文档

本文介绍下Cesium中 Viewer API的详细使用说明。

Viewer API 调用方法

new Cesium.Viewer(container, options)
Viewer是用于构建应用程序的基础部件。它将所有标准的Cesium部件组合成一个可重用的包。 Viewer部件通常可以利用mixin来扩展,以此增加对各种应用程序有用的功能函数。
Name Type Description
container Element | String 将容纳Viewer的HTML DOM 元素或ID。
options Object optional 对象,具有以下属性:
Name Type Default Description
animation Boolean true optional 是否创建Animation部件。
baseLayerPicker Boolean true optional 是否创建BaseLayerPicker部件。
fullscreenButton Boolean true optional 如果设置为false,则不会创建FullscreenButton部件。
vrButton Boolean false optional 如果设置为true,将创建VRButton部件。
geocoder Boolean | Array.<GeocoderService> true optional 如果设置为false,则不会创建Geocoder部件。
homeButton Boolean true optional 如果设置为false,则不会创建HomeButton部件。
infoBox Boolean true optional 如果设置为false,则不会创建InfoBox部件。
sceneModePicker Boolean true optional 如果设置为false,将不会创建SceneModePicker部件。
selectionIndicator Boolean true optional 如果设置为false,则不会创建SelectionIndicator部件。
timeline Boolean true optional 如果设置为false,则不会创建Timeline部件。
navigationHelpButton Boolean true optional 如果设置为false,将不会创建NavigationHelpButton。
navigationInstructionsInitiallyVisible Boolean true optional 如果导航指令最初应该是可见的,则为True;如果在用户显式单击按钮之前不应该显示,则为false。
scene3DOnly Boolean false optionaltrue时,为了节省GPU内存,每个几何实例只会在3D下被渲染。
shouldAnimate Boolean false optional 如果时钟默认尝试使仿真时间前进,则为true,否则为false。此选项优先于设置Viewer#clockViewModel
clockViewModel ClockViewModel new ClockViewModel(options.clock) optional 用于控制当前时间的ClockViewModel。
selectedImageryProviderViewModel ProviderViewModel optional 如果没有提供第一个可用的基本图层,则使用当前基本图像层的视图模型。此值仅在options.baseLayerPicker设置为true时有效。
imageryProviderViewModels Array.<ProviderViewModel> createDefaultImageryProviderViewModels() optional 可从BaseLayerPicker中选择的ProviderViewModels数组。此值仅在options.baseLayerPicker设置为true时有效。
selectedTerrainProviderViewModel ProviderViewModel optional 当前基本地形图层的视图模型,如果没有提供,则使用第一个可用的基本图层。此值仅在options.baseLayerPicker设置为true时有效。
terrainProviderViewModels Array.<ProviderViewModel> createDefaultTerrainProviderViewModels() optional 可从BaseLayerPicker中选择的ProviderViewModels数组。 此值仅在options.baseLayerPicker设置为true时有效。
imageryProvider ImageryProvider createWorldImagery() optional 要使用的 imageryProvider。此值仅在options.baseLayerPicker设置为false时有效。
terrainProvider TerrainProvider new EllipsoidTerrainProvider() optional 要使用的 terrainProvider。
skyBox SkyBox optional 用于渲染星辰的天空盒,未定义时,使用默认星辰效果。
skyAtmosphere SkyAtmosphere optional 环绕地球边缘的蓝天和光晕效果,设置为false可将其关闭。
fullscreenElement Element | String document.body optional 当按下全屏按钮时,要放置到全屏模式的元素或id。
useDefaultRenderLoop Boolean true optional 如果此部件需要控制渲染循环,则为true,否则为false。
targetFrameRate Number optional 使用默认渲染循环时的目标帧速率。
showRenderLoopErrors Boolean true optional 如果为true,如果出现渲染循环错误,此部件将自动向用户显示包含错误的HTML面板。
useBrowserRecommendedResolution Boolean false optional 如果为true,则按照浏览器推荐的分辨率渲染,忽略window.devicePixelRatio
automaticallyTrackDataSourceClocks Boolean true optional 如果为true,此部件将自动跟踪新添加的数据源的时钟设置,并在数据源的时钟发生更改时进行更新。如果想要独立配置时钟,请将此设置为false。
contextOptions Object optional Context 和 WebGL 的创建属性,与传递给Sceneoptions相一致。
sceneMode SceneMode SceneMode.SCENE3D optional 初始场景模式(SceneMode)。
mapProjection MapProjection new GeographicProjection() optional 在2D和哥伦布视图模式中使用的地图投影。
globe Globe new Globe(mapProjection.ellipsoid) optional 场景中使用的地球。如果设置为false,则不添加地球。
orderIndependentTranslucency Boolean true optional 如果为true,且设备支持,则使用与顺序无关的半透明性。
creditContainer Element | String optional 包含CreditDisplay的DOM元素或ID。如果没有指定,认证(credits)将添加到部件本身的底部。
creditViewport Element | String optional 包含由CreditDisplay创建的认证(credit)弹出窗口的DOM元素或ID。如果没有指定,它将出现在部件本身上。
dataSources DataSourceCollection new DataSourceCollection() optional 由部件可视化的数据源集合。如果提供了该参数,则假定该实例为调用者所有,并且不会在销毁查看器(viewer)时销毁该实例。
terrainExaggeration Number 1.0 optional 用于设置地形夸张系数。请注意,地形夸张不会修改任何其他图元,因为它们的位置相对于椭球体。
shadows Boolean false optional 确定阴影是否由太阳投射形成。
terrainShadows ShadowMode ShadowMode.RECEIVE_ONLY optional 确定地形是否投射或接收来自太阳的阴影。
mapMode2D MapMode2D MapMode2D.INFINITE_SCROLL optional 确定2D地图是可旋转的,还是可以在水平方向上无限滚动。
projectionPicker Boolean false optional 如果设置为true,则会创建ProjectionPicker部件。
requestRenderMode Boolean false optional 如果为true,渲染帧将只在需要时发生,由场景中的变化决定。启用可减少应用程序的CPU/GPU使用量, 并减少移动设备上的电池消耗,但需要使用Scene#requestRender在此模式下显式渲染新帧。在许多情况下,在API的其他部分对场景进行更改之后,这将是必要的。 请参考Improving Performance with Explicit Rendering
maximumRenderTimeChange Number 0.0 optional 如果requestRenderMode为true,则此值定义在渲染被请求之前允许的最大仿真时间更改。 请参考Improving Performance with Explicit Rendering
异常情况:
  • DeveloperError : 文档中不存在具有该标识的"container"元素。
  • DeveloperError : 当不使用BaseLayerPicker部件时,options.selectedImageryProviderViewModel不可用,请指定options.imageryProvider。
  • DeveloperError : 当不使用BaseLayerPicker部件时,options.selectedTerrainProviderViewModel不可用,请指定options.terrainProvider。
示例:
// 使用几个自定义选项和mixin初始化viewer部件。
var viewer = new Cesium.Viewer('cesiumContainer', {
    // 从哥伦布查看器(Columbus Viewer)开始
    sceneMode : Cesium.SceneMode.COLUMBUS_VIEW,
    // 使用Cesium世界地形
    terrainProvider : Cesium.createWorldTerrain(),
    // 隐藏基本图层选择器
    baseLayerPicker : false,
    // 使用OpenStreetMaps
    imageryProvider : new Cesium.OpenStreetMapImageryProvider({
        url : 'https://a.tile.openstreetmap.org/'
    }),
    // Use high-res stars downloaded from https://github.com/AnalyticalGraphicsInc/cesium-assets
    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'
        }
    }),
    // 用网页墨卡托(Web Mercator)投影显示哥伦布视图(Columbus View)地图
    mapProjection : new Cesium.WebMercatorProjection()
});
// 添加基本的拖放功能
viewer.extend(Cesium.viewerDragDropMixin);
// 如果我们在处理一个被删除的文件时遇到错误,显示一个弹出的警告
viewer.dropError.addEventListener(function(dropHandler, name, error) {
    console.log(error);
    window.alert(error);
});
演示Demo:
参考:

成员变量

allowDataSourcesToSuspendAnimation : Boolean
获取或设置数据源是否可以临时暂停动画,以避免向用户显示不完整的图像。 例如,如果异步图元是在后台处理的,那么时钟在几何图形准备好之前不会前进。
获取动画(Animation)部件。
readonlybaseLayerPicker : BaseLayerPicker
获取基础图层选择器(BaseLayerPicker)。
readonlybottomContainer : Element
获取窗口底部区域的DOM元素,该区域包含CreditDisplay和潜在的其他内容。
获取相机(Camera)。
readonlycanvas : Canvas
获取画布(Canvas)。
获取CesiumWidget。
获取时钟(Clock)。
clockTrackedDataSource : DataSource
获取或设置使用查看器时钟跟踪的数据源。
获取时钟视图模型(ClockViewModel)。
readonlycontainer : Element
获取父容器。
readonlydataSourceDisplay : DataSourceDisplay
获取用于DataSource可视化的显示。
获取要显示的DataSource实例集。
获取未关联到特定数据源的实体集合。 这是访问 dataSourceDisplay.defaultDataSource.entities的快捷方式。
readonlyfullscreenButton : FullscreenButton
获取全屏按钮(FullscreenButton)。
获取地理编码(Geocoder)。
获取主画面按钮(HomeButton)。
获取将在地球上渲染的图像图层的集合。
获取消息盒(InfoBox)。
获取导航帮助按钮(NavigationHelpButton)。
获取后处理阶段集合(PostProcessStageCollection)。
readonlyprojectionPicker : ProjectionPicker
获取投影选择器(ProjectionPicker)。
resolutionScale : Number
获取或设置渲染分辨率的比例因子。 小于1.0的值可以在功能较弱的设备上提高性能,而大于1.0的值将以更高的分辨率渲染,然后缩小比例,从而提高视觉保真度。 例如,如果部件的大小为640x480,将该值设置为0.5将导致场景以320x240的大小呈现,然后按比例放大, 而将其设置为2.0将导致场景以1280x960的大小呈现,然后按比例缩小。
Default Value: 1.0
获取scene。
readonlysceneModePicker : SceneModePicker
获取场景模式选择器(SceneModePicker)。
readonlyscreenSpaceEventHandler : ScreenSpaceEventHandler
获取屏幕空间事件处理程序(ScreenSpaceEventHandler)。
获取或设置要为其显示选择指示符的对象实例。
readonlyselectedEntityChanged : Event
获取所选实体更改时引发的事件。
readonlyselectionIndicator : SelectionIndicator
获取选择指示器(SelectionIndicator)。
获取场景的阴影地图(ShadowMap)。
shadows : Boolean
确定阴影是否由太阳投射形成。
targetFrameRate : Number
获取或设置当useDefaultRenderLoop为true时,部件的目标帧率。 如果未定义,浏览器的requestAnimationFrame实现将确定帧速率。如果定义了,这个值必须大于0。 高于底层requestAnimationFrame实现的值将不起作用。
为地球提供表面几何图形的terrainProvider。
确定地形是否投射或阴影来自太阳。
获取时间轴(Timeline)部件。
获取或设置相机当前跟踪的实体实例。
readonlytrackedEntityChanged : Event
获取被跟踪实体更改时引发的事件。
useBrowserRecommendedResolution : Boolean
指示是否使用浏览器的推荐分辨率的布尔值。 如果为true,则忽略浏览器的设备像素比,代之以1.0,有效地基于CSS像素而不是设备像素进行渲染。这可以提高具有高像素密度的低功能设备的性能。 当为false时,渲染将以设备像素为单位。无论这个布尔值是true还是false,Viewer#resolutionScale仍然有效。
Default Value: false
useDefaultRenderLoop : Boolean
获取或设置此部件是否应控制渲染循环。 如果设置为true,部件将使用requestAnimationFrame来执行部件的渲染和调整大小,以及驱动仿真时钟。 如果设置为false,您必须手动调用resizerender方法作为自定义渲染循环的一部分。 如果在渲染过程中出现错误,ScenerenderError事件将被触发,该属性将被设置为false。 必须将其设置为true,以便在发生错误后继续渲染。
获取VRButton。

内置方法

销毁部件。如果从布局中永久删除viewer部件,则应调用。
extend(mixin, options)
使用提供的mixin扩展基本viewer功能。 mixin可以向提供的viewer实例添加其他属性、函数或其他行为。
Name Type Description
mixin Viewer~ViewerMixin 要添加到此viewer实例的mixin。
options Object optional 要传递给mixin函数的options对象。
参考:
flyTo(target, options)Promise.<Boolean>
将相机切换到提供的实体、实体集或数据源。 如果数据源仍然在加载过程中,或者可视化仍然在加载中,则此方法将等待数据准备好后再执行飞行。

偏移量是在以包围球中心为中心的当地东北向上(east-north-up)参考坐标系中的航向/俯仰/范围(heading/pitch/range)。 航向和俯仰角是在当地的东北向上(east-north-up)参考系中确定的。 航向(heading)是从y轴向x轴递增的角度。俯仰(Pitch)是从xy平面旋转过来的。正俯仰角在平面之上。负俯仰角在平面以下。 范围是到中心的距离。如果范围为零,则计算范围使整个包围球可见。

在2D中,必须是一个自顶向下的视图。相机将被放置在目标上方向下看。目标上方的高度将是范围。 航向(heading)将从偏移量确定。如果无法从偏移量确定航向,则航向为北。

Name Type Description
target Entity | Array.<Entity> | EntityCollection | DataSource | ImageryLayer | Cesium3DTileset | TimeDynamicPointCloud | Promise.<(Entity|Array.<Entity>|EntityCollection|DataSource|ImageryLayer|Cesium3DTileset|TimeDynamicPointCloud)> 要查看的实体、实体数组、实体集合、数据源、Cesium3DTileset、点云或图像层。您还可以传递一个promise,该promise将解析到前面提到的一种类型。
options Object optional 对象,具有以下属性:
Name Type Default Description
duration Number 3.0 optional 飞行时间以秒为单位。
maximumHeight Number optional 飞行中的最高高度。
offset HeadingPitchRange optional 在当地的东北向上(east-north-up)参考系中从目标到以目标为中心的偏移量。
返回值:
飞行成功时,promise被解析为true;如果实体未在场景中可视化或飞行取消,promise被解析为false。 //TODO: Cleanup entity mentions
这迫使部件重新考虑它的布局,包括部件大小和版权的放置。
isDestroyed()Boolean
返回值:
如果对象已被销毁,则为true,否则为false。
渲染的场景。除非useDefaultRenderLoop设置为false,否则自动调用此函数。
调整部件的大小以匹配容器的大小。 除非useDefaultRenderLoop被设置为false,否则将根据需要自动调用此函数。
zoomTo(target, offset)Promise.<Boolean>
异步设置相机以查看提供的实体、实体集或数据源。 如果数据源仍然在加载过程中,或者可视化仍然在加载中,则此方法将等待数据准备好后再执行缩放。

偏移量是在以包围球中心为中心的当地东北向上(east-north-up)参考坐标系中的航向/俯仰/范围(heading/pitch/range)。 航向和俯仰角是在当地的东北向上(east-north-up)参考系中确定的。 航向(heading)是从y轴向x轴递增的角度。俯仰(Pitch)是从xy平面旋转过来的。正俯仰角在平面之上。负俯仰角在平面以下。 范围是到中心的距离。如果范围为零,则计算范围使整个包围球可见。

在2D中,必须是一个自顶向下的视图。相机将被放置在目标上方向下看。目标上方的高度将是范围。 航向(heading)将从偏移量确定。如果无法从偏移量确定航向,则航向为北。

Name Type Description
target Entity | Array.<Entity> | EntityCollection | DataSource | ImageryLayer | Cesium3DTileset | TimeDynamicPointCloud | Promise.<(Entity|Array.<Entity>|EntityCollection|DataSource|ImageryLayer|Cesium3DTileset|TimeDynamicPointCloud)> 要查看的实体、实体数组、实体集合、数据源、Cesium3DTileset、点云或图像层。您还可以传递一个promise,该promise将解析到前面提到的一种类型。
offset HeadingPitchRange optional 在本地东北方向上(east-north-up)的参考系中,从实体中心的偏移量。
返回值:
缩放成功时,promise被解析为true;如果实体未在场景中可视化或缩放取消,promise被解析为false。

类型定义

ViewerMixin(viewer, options)
通过附加功能扩展Viewer实例的功能。
Name Type Description
viewer Viewer viewer实例。
options Object 要传递给mixin函数的可选对象。
参考:

其他API

Cesium中文API文档手册(v1.63.1版本)参考:《Cesium中文API文档手册(v1.63.1版本)

相关阅读

麻辣GIS-Sailor

作者:

GIS爱好者,学GIS,更爱玩GIS。

声明

1.本文所分享的所有需要用户下载使用的内容(包括但不限于软件、数据、图片)来自于网络或者麻辣GIS粉丝自行分享,版权归该下载资源的合法拥有者所有,如有侵权请第一时间联系本站删除。

2.下载内容仅限个人学习使用,请切勿用作商用等其他用途,否则后果自负。

手机阅读
公众号关注
知识星球
手机阅读
麻辣GIS微信公众号关注
最新GIS干货
关注麻辣GIS知识星球
私享圈子

留言板(小编看到第一时间回复)