基于cesium开发地图时用到的组件是:new Cesium.Viewer(container, options),container为地图在页面中放置位置的id,options是初始化设置的选项,包括是否显示homeButton,动画组件,时间轴以及底图等。具体开发过程中用到的选项可参考官方api(https://cesiumjs.org/refdoc/)
常用的选项如下:
let viewer = new this.Cesium.Viewer("cesiumContainer", {
animation: false, //是否创建动画小器件,左下角仪表
baseLayerPicker: false, //是否显示图层选择器
fullscreenButton: false, //是否显示全屏按钮
geocoder: false, //是否显示geocoder小器件,右上角查询按钮
homeButton: false, //是否显示Home按钮
infoBox: false, //是否显示信息框
sceneModePicker: false, //是否显示3D/2D选择器,与scene3DOnly不能同时为true
selectionIndicator: false, //是否显示选取指示器组件
timeline: false, //是否显示时间轴
navigationHelpButton: false, //是否显示右上角的帮助按钮
scene3DOnly: true, //如果设置为true,则所有几何图形以3D模式绘制以节约GPU资源
clock: new this.Cesium.Clock(), //用于控制当前时间的时钟对象
selectedImageryProviderViewModel: undefined, //当前图像图层的显示模型,仅baseLayerPicker设为true有意义
imageryProviderViewModels: this.Cesium.createDefaultImageryProviderViewModels(), //可供BaseLayerPicker选择的图像图层ProviderViewModel数组
selectedTerrainProviderViewModel: undefined, //当前地形图层的显示模型,仅baseLayerPicker设为true有意义
terrainProviderViewModels: this.Cesium.createDefaultTerrainProviderViewModels(), //可供BaseLayerPicker选择的地形图层ProviderViewModel数组
imageryProvider: new this.Cesium.createOpenStreetMapImageryProvider({
credit: "",
url: 'https://a.tile.openstreetmap.org/'
}), //图像图层提供者,仅baseLayerPicker设为false有意义
terrainProvider: new this.Cesium.EllipsoidTerrainProvider(), //地形图层提供者,仅baseLayerPicker设为false有意义
skyBox: new this.Cesium.SkyBox({
sources: {
positiveX: 'skybox_px.png',
negativeX: 'skybox_nx.png',
positiveY: 'skybox_py.png',
negativeY: 'skybox_ny.png',
positiveZ: 'skybox_pz.png',
negativeZ: 'skybox_nz.png'
}
}), //用于渲染星空的SkyBox对象
fullscreenElement: document.body, //全屏时渲染的HTML元素,
useDefaultRenderLoop: true, //如果需要控制渲染循环,则设为true
targetFrameRate: undefined, //使用默认render loop时的帧率
showRenderLoopErrors: true, //如果设为true,将在一个HTML面板中显示错误信息
automaticallyTrackDataSourceClocks: true, //自动追踪最近添加的数据源的时钟设置
contextOptions: undefined, //传递给Scene对象的上下文参数(scene.options)
sceneMode: this.Cesium.SceneMode.SCENE3D, //初始场景模式
mapProjection: new this.Cesium.WebMercatorProjection(), //地图投影体系
dataSources: new this.Cesium.DataSourceCollection()
//需要进行可视化的数据源的集合
})