|
|
|
|
|
// Viewer初始化
|
|
|
|
|
|
import {
|
|
|
|
|
|
Viewer,
|
|
|
|
|
|
TileMapServiceImageryProvider,
|
|
|
|
|
|
ImageryLayer,
|
|
|
|
|
|
RequestScheduler,
|
|
|
|
|
|
SceneMode,
|
|
|
|
|
|
buildModuleUrl,
|
|
|
|
|
|
} from 'cesium'
|
|
|
|
|
|
|
|
|
|
|
|
//离线地球底图
|
|
|
|
|
|
const earth_native = TileMapServiceImageryProvider.fromUrl(
|
|
|
|
|
|
// 'node_modules/cesium/Build/CesiumUnminified/Assets/Textures/NaturalEarthII',
|
|
|
|
|
|
buildModuleUrl('Assets/Textures/NaturalEarthII'),
|
|
|
|
|
|
)
|
|
|
|
|
|
/**
|
|
|
|
|
|
* Viewer初始化
|
|
|
|
|
|
* @param container :id或HTML对象
|
|
|
|
|
|
* @returns :viewer对象
|
|
|
|
|
|
*/
|
|
|
|
|
|
function initViewer(container: string | Element): Viewer {
|
|
|
|
|
|
//未联网状态加载默认本地底图，保证地球有底图显示
|
|
|
|
|
|
const viewer = new Viewer(container as HTMLElement, {
|
|
|
|
|
|
infoBox: false, //是否显示点击要素之后显示的信息
|
|
|
|
|
|
homeButton: false, //是否显示Home按钮
|
|
|
|
|
|
navigationHelpButton: false, //是否显示帮助信息控件
|
|
|
|
|
|
timeline: false, //是否显示时间线控件
|
|
|
|
|
|
animation: false, //是否显示动画控件
|
|
|
|
|
|
sceneModePicker: true, //是否显示投影方式控件
|
|
|
|
|
|
sceneMode: SceneMode.SCENE3D, //设置场景模式，3D球体
|
|
|
|
|
|
// terrain: Cesium.Terrain.fromWorldTerrain(),
|
|
|
|
|
|
baseLayerPicker: false, //是否显示图层选择控件
|
|
|
|
|
|
requestRenderMode: true, //启用请求渲染模式
|
|
|
|
|
|
scene3DOnly: false, //每个几何实例将只能以3D渲染以节省GPU内存
|
|
|
|
|
|
fullscreenButton: false, //右下角 全屏控件
|
|
|
|
|
|
orderIndependentTranslucency: false,
|
|
|
|
|
|
contextOptions: { webgl: { alpha: true } },
|
|
|
|
|
|
maximumRenderTimeChange: Infinity, // 无操作时自动渲染帧率，设为数字会消耗性能，Infinity为无操作不渲染
|
|
|
|
|
|
// mapProjection: new Cesium.WebMercatorProjection(),
|
|
|
|
|
|
baseLayer: ImageryLayer.fromProviderAsync(earth_native, {}),
|
|
|
|
|
|
})
|
|
|
|
|
|
//去除cesium logo，隐藏版本信息
|
|
|
|
|
|
const creditContainer = viewer.cesiumWidget.creditContainer as HTMLDivElement
|
|
|
|
|
|
creditContainer.style.display = 'none'
|
|
|
|
|
|
// 水雾特效
|
|
|
|
|
|
viewer.scene.globe.showGroundAtmosphere = true
|
|
|
|
|
|
// 限制相机缩放
|
|
|
|
|
|
viewer.scene.screenSpaceCameraController.minimumZoomDistance = 200 //相机的高度的最小值
|
|
|
|
|
|
viewer.scene.screenSpaceCameraController.maximumZoomDistance = 20000000 //相机高度的最大值
|
|
|
|
|
|
return viewer
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
|
* 性能优化
|
|
|
|
|
|
* @param viewer :场景Viewer
|
|
|
|
|
|
*/
|
|
|
|
|
|
function perfViewer(viewer: Viewer) {
|
|
|
|
|
|
// 抗锯齿
|
|
|
|
|
|
// 是否支持图像渲染像素化处理
|
|
|
|
|
|
// if (Cesium.FeatureDetection.supportsImageRenderingPixelated()) {
|
|
|
|
|
|
// viewer.resolutionScale = window.devicePixelRatio
|
|
|
|
|
|
// }
|
|
|
|
|
|
viewer.scene.postProcessStages.fxaa.enabled = true
|
|
|
|
|
|
// 关闭太阳，月亮，天空盒，雾等相关特效
|
|
|
|
|
|
viewer.scene.moon.show = false
|
|
|
|
|
|
viewer.scene.fog.enabled = false
|
|
|
|
|
|
viewer.scene.sun.show = false
|
|
|
|
|
|
viewer.scene.skyBox.show = false
|
|
|
|
|
|
// 优化加载WMTS图层速度
|
|
|
|
|
|
RequestScheduler.maximumRequestsPerServer = 18 // 设置cesium请求调度器的最大并发数量
|
|
|
|
|
|
RequestScheduler.throttleRequests = false //关闭请求调度器的请求节流
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
export { initViewer, perfViewer }
|
