434 lines
13 KiB
JavaScript
434 lines
13 KiB
JavaScript
|
/**
|
|||
|
* https://blog.csdn.net/qq_34205305/article/details/124862712
|
|||
|
*/
|
|||
|
import { keyboardMapRoamingInit } from '../Global/KeyBoard'
|
|||
|
import { createCluster } from '../Global/cluster/cluster'
|
|||
|
// import mouseRightMenu from '../Global/mouseRightMenu'
|
|||
|
import { check } from '../BaseDialog/rule'
|
|||
|
import { init_material } from '../Obj/Materail'
|
|||
|
import AModelLoader from '../Obj/Base/LoadObjModel/AModelLoader'
|
|||
|
import { setSvg } from '../Obj/Element/svg'
|
|||
|
import Tools from '../Tools'
|
|||
|
import { Proj } from '../Tools/proj'
|
|||
|
import {
|
|||
|
unRegLeftClickCallback,
|
|||
|
unRegRightClickCallback,
|
|||
|
unregMoveCallback
|
|||
|
} from '../Global/ClickCallback'
|
|||
|
import {
|
|||
|
getCesiumIndexedDBMaxSize,
|
|||
|
setCesiumIndexedDBMaxSize,
|
|||
|
getCesiumManageIndexexDBState,
|
|||
|
setCesiumManageIndexexDBState,
|
|||
|
closeRotateAround,
|
|||
|
closeViewFollow
|
|||
|
} from '../Global/global'
|
|||
|
import { syncSplitData, setActiveId } from '../Global/SplitScreen'
|
|||
|
import { apiQueryGoodsList } from '../Tools/getGoodsList'
|
|||
|
// window.check = check
|
|||
|
|
|||
|
class YJEarth {
|
|||
|
#_requestAnimationFrameEventId = undefined
|
|||
|
/**
|
|||
|
* @constructor
|
|||
|
* @param div_id {string} 地球所在的dom id
|
|||
|
* @param [options]
|
|||
|
* @example new YJ.YJEarth("dom_id")
|
|||
|
* */
|
|||
|
constructor(div_id, options = {}) {
|
|||
|
this.div_id = div_id
|
|||
|
this.entityMap = new Map()
|
|||
|
this._entityZIndex = 0
|
|||
|
this.viewer = null
|
|||
|
this.options = { ...options }
|
|||
|
// apiQueryGoodsList()
|
|||
|
// setCesiumIndexedDBMaxSize(getCesiumIndexedDBMaxSize())
|
|||
|
setCesiumManageIndexexDBState(getCesiumManageIndexexDBState())
|
|||
|
this.proj = new Proj()
|
|||
|
this.init()
|
|||
|
setSvg()
|
|||
|
}
|
|||
|
|
|||
|
addIncetance(id, obj) {
|
|||
|
this.entityMap.set(id, obj)
|
|||
|
}
|
|||
|
|
|||
|
getIncetance(id) {
|
|||
|
return this.entityMap.get(id)
|
|||
|
}
|
|||
|
|
|||
|
removeIncetance(id) {
|
|||
|
this.entityMap.delete(id)
|
|||
|
unRegLeftClickCallback(id)
|
|||
|
unRegRightClickCallback(id)
|
|||
|
unregMoveCallback(id)
|
|||
|
|
|||
|
syncSplitData(this, id)
|
|||
|
}
|
|||
|
|
|||
|
setDefaultView(options) {
|
|||
|
if (options) {
|
|||
|
this.viewer.CAMERA_DEFAULT_VIEW_RECTANGLE = {
|
|||
|
destination: options.destination || {},
|
|||
|
orientation: options.orientation || {}
|
|||
|
}
|
|||
|
closeRotateAround(this)
|
|||
|
closeViewFollow(this)
|
|||
|
this.viewer.camera.flyTo({
|
|||
|
destination: Cesium.Cartesian3.fromDegrees(
|
|||
|
options.destination.lng,
|
|||
|
options.destination.lat,
|
|||
|
options.destination.alt
|
|||
|
),
|
|||
|
orientation: {
|
|||
|
heading: Cesium.Math.toRadians(options.orientation.heading || 0),
|
|||
|
pitch: Cesium.Math.toRadians(options.orientation.pitch || 0),
|
|||
|
roll: Cesium.Math.toRadians(options.orientation.roll || 0)
|
|||
|
},
|
|||
|
duration: 0
|
|||
|
})
|
|||
|
} else {
|
|||
|
this.viewer.CAMERA_DEFAULT_VIEW_RECTANGLE = undefined
|
|||
|
//设置cesium的默认视角
|
|||
|
Cesium.Camera.DEFAULT_VIEW_RECTANGLE = Cesium.Rectangle.fromDegrees(
|
|||
|
//西边的经度
|
|||
|
89.5,
|
|||
|
//南边的纬度
|
|||
|
10.4,
|
|||
|
//东边的经度
|
|||
|
110.4,
|
|||
|
//北边的维度
|
|||
|
61.2
|
|||
|
)
|
|||
|
// this.viewer.camera.flyHome()
|
|||
|
this.viewer.camera.setView({
|
|||
|
destination: Cesium.Camera.DEFAULT_VIEW_RECTANGLE
|
|||
|
})
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
init() {
|
|||
|
let cgs2000Ellipsolid = new Cesium.Ellipsoid(
|
|||
|
6378137.0,
|
|||
|
6378137.0,
|
|||
|
6356752.31414035585
|
|||
|
)
|
|||
|
let cgs2000GeographicProj = new Cesium.GeographicProjection(
|
|||
|
cgs2000Ellipsolid
|
|||
|
)
|
|||
|
let _this = this
|
|||
|
this.options = {
|
|||
|
imageryProvider: new Cesium.TileMapServiceImageryProvider({
|
|||
|
url: Cesium.buildModuleUrl('Assets/Textures/NaturalEarthII')
|
|||
|
}),
|
|||
|
baseLayerPicker: false,
|
|||
|
geocoder: false,
|
|||
|
animation: false,
|
|||
|
fullscreenButton: false,
|
|||
|
navigationHelpButton: false,
|
|||
|
// vrButton?: boolean;
|
|||
|
homeButton: false,
|
|||
|
infoBox: false,
|
|||
|
sceneModePicker: false,
|
|||
|
selectionIndicator: false,
|
|||
|
timeline: false,
|
|||
|
shouldAnimate: true,
|
|||
|
mapProjection: cgs2000GeographicProj
|
|||
|
}
|
|||
|
if (Number(Cesium.VERSION.split('.')[1]) >= 107) {
|
|||
|
this.options.baseLayer = Cesium.ImageryLayer.fromProviderAsync(
|
|||
|
Cesium.TileMapServiceImageryProvider.fromUrl(
|
|||
|
Cesium.buildModuleUrl('Assets/Textures/NaturalEarthII')
|
|||
|
)
|
|||
|
)
|
|||
|
} else {
|
|||
|
this.options.imageryProvider = new Cesium.TileMapServiceImageryProvider({
|
|||
|
url: Cesium.buildModuleUrl('Assets/Textures/NaturalEarthII')
|
|||
|
})
|
|||
|
}
|
|||
|
this.options.contextOptions = {
|
|||
|
webgl: {
|
|||
|
alpha: true,
|
|||
|
depth: true,
|
|||
|
stencil: true,
|
|||
|
antialias: true,
|
|||
|
premultipliedAlpha: true,
|
|||
|
preserveDrawingBuffer: true,
|
|||
|
failIfMajorPerformanceCaveat: true
|
|||
|
},
|
|||
|
requestWebgl2: true
|
|||
|
}
|
|||
|
Cesium.RequestScheduler.maximumRequests = 500
|
|||
|
this.viewer = new Cesium.Viewer(this.div_id, this.options)
|
|||
|
this.viewer.scene.imageryLayers._layers[0].notes = 'default-base-map'
|
|||
|
this.viewer._shadows = this.viewer.shadows
|
|||
|
|
|||
|
this.viewer.scene.screenSpaceCameraController.maximumZoomDistance = 50000000
|
|||
|
|
|||
|
// 地球透明
|
|||
|
this.viewer.scene.globe.translucency.enabled = true
|
|||
|
|
|||
|
// 天空盒
|
|||
|
let tools = new Tools()
|
|||
|
this.viewer.scene.skyBox = new Cesium.SkyBox({
|
|||
|
sources: {
|
|||
|
negativeX:
|
|||
|
tools.getSourceRootPath() + '/img/skyBox/2/tycho2t3_80_mx.jpg',
|
|||
|
negativeY:
|
|||
|
tools.getSourceRootPath() + '/img/skyBox/2/tycho2t3_80_my.jpg',
|
|||
|
negativeZ:
|
|||
|
tools.getSourceRootPath() + '/img/skyBox/2/tycho2t3_80_mz.jpg',
|
|||
|
positiveX:
|
|||
|
tools.getSourceRootPath() + '/img/skyBox/2/tycho2t3_80_px.jpg',
|
|||
|
positiveY:
|
|||
|
tools.getSourceRootPath() + '/img/skyBox/2/tycho2t3_80_py.jpg',
|
|||
|
positiveZ:
|
|||
|
tools.getSourceRootPath() + '/img/skyBox/2/tycho2t3_80_pz.jpg'
|
|||
|
}
|
|||
|
})
|
|||
|
|
|||
|
init_material()
|
|||
|
|
|||
|
let fontData = [
|
|||
|
{
|
|||
|
name: '思源黑体',
|
|||
|
value: 'SourceHanSansTi',
|
|||
|
url: tools.getSourceRootPath() + '/custom/fonts/SourceHanSansCN-Medium.otf',
|
|||
|
format: 'opentype'
|
|||
|
},
|
|||
|
{
|
|||
|
name: '庞门正道标题体',
|
|||
|
value: 'PMZDBTTi',
|
|||
|
url: tools.getSourceRootPath() + '/custom/fonts/PangMenZhengDaoBiaoTiTi-1.ttf',
|
|||
|
format: 'truetype'
|
|||
|
},
|
|||
|
{
|
|||
|
name: '数黑体',
|
|||
|
value: 'AlimamaShuHeiTi',
|
|||
|
url: tools.getSourceRootPath() + '/custom/fonts/AlimamaShuHeiTi-Bold.ttf',
|
|||
|
format: 'truetype'
|
|||
|
}
|
|||
|
]
|
|||
|
for (let i = 0; i < fontData.length; i++) {
|
|||
|
let font = new FontFace(
|
|||
|
fontData[i].value,
|
|||
|
`url('${fontData[i].url}') format('${fontData[i].format}')`,
|
|||
|
)
|
|||
|
font.load()
|
|||
|
document.fonts.add(font);
|
|||
|
}
|
|||
|
|
|||
|
document.fonts.ready.then(() => {
|
|||
|
for (let [id, obj] of this.entityMap) {
|
|||
|
if('labelFontFamily' in obj) {
|
|||
|
obj.labelFontFamily = obj.labelFontFamily
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
});
|
|||
|
|
|||
|
// const font = new FontFace(
|
|||
|
// 'TencentSans W7CN',
|
|||
|
// `url('${tools.getSourceRootPath()}/custom/fonts/TencentSans-W7-CN.woff2') format('woff2')`,
|
|||
|
// );
|
|||
|
// font.load()
|
|||
|
|
|||
|
this.setDefaultView()
|
|||
|
//加载Cesium默认的地形数据。Bing在线地形影像--很慢,可以指定mapStyle,详见BingMapsStyle类
|
|||
|
// var terrainProvider = Cesium.createWorldTerrain({
|
|||
|
// requestWaterMask: true, // 请求水体效果所需要的海岸线数据
|
|||
|
// requestVertexNormals: true, // 请求地形照明数据
|
|||
|
// });
|
|||
|
// this.viewer.terrainProvider = terrainProvider;
|
|||
|
// this.viewer.camera.flyHome()
|
|||
|
Cesium.Ion.defaultAccessToken =
|
|||
|
'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiJhZmM5ODNkYy0yMTIzLTQxNzktOTE1Yy1mN2QxNmFkMjgyMTUiLCJpZCI6Mjk0NzIsInNjb3BlcyI6WyJhc3IiLCJnYyJdLCJpYXQiOjE1OTIyMjkxMTJ9.9oYggi4kZgcapD2BkEGF8kG8tTuVkF33FdwxB2JKXeA'
|
|||
|
this.viewer.scene.globe.depthTestAgainstTerrain = true
|
|||
|
this.viewer.scene.screenSpaceCameraController.zoomEventTypes = [
|
|||
|
Cesium.CameraEventType.WHEEL,
|
|||
|
Cesium.CameraEventType.PINCH
|
|||
|
]
|
|||
|
this.viewer.scene.screenSpaceCameraController.tiltEventTypes = [
|
|||
|
Cesium.CameraEventType.PINCH,
|
|||
|
Cesium.CameraEventType.RIGHT_DRAG
|
|||
|
]
|
|||
|
// //视频融合 加载obj模型
|
|||
|
// window.objLoader = new AModelLoader(this.viewer.scene.context)
|
|||
|
//取消左键双击
|
|||
|
this.viewer.cesiumWidget.screenSpaceEventHandler.removeInputAction(
|
|||
|
Cesium.ScreenSpaceEventType.LEFT_DOUBLE_CLICK
|
|||
|
)
|
|||
|
/*禁止平移*/
|
|||
|
// this.viewer.scene.screenSpaceCameraController.enableTranslate = false
|
|||
|
// this.setSceneRotate(true)
|
|||
|
if (Cesium.FeatureDetection.supportsImageRenderingPixelated()) {
|
|||
|
//判断是否支持图像渲染像素化处理
|
|||
|
this.viewer.resolutionScale = window.devicePixelRatio
|
|||
|
}
|
|||
|
this.viewer.scene.fxaa = true
|
|||
|
this.viewer.scene.postProcessStages.fxaa.enabled = true
|
|||
|
this.viewer.scene.screenSpaceCameraController.enableCollisionDetection = true //true 禁止 false 允许
|
|||
|
createCluster(this.viewer)
|
|||
|
keyboardMapRoamingInit(this.viewer)
|
|||
|
Cesium.viewerCesiumNavigationMixin(this.viewer, {
|
|||
|
// 修改重置视图的tooltip
|
|||
|
resetTooltip: '重置视图',
|
|||
|
// 修改放大按钮的tooltip
|
|||
|
zoomInTitle: '缩小',
|
|||
|
// 修改缩小按钮的tooltip
|
|||
|
zoomOutTitle: '放大'
|
|||
|
})
|
|||
|
|
|||
|
// 操作罗盘时关闭绕点旋转和轨迹运动的视角跟随
|
|||
|
setTimeout(() => {
|
|||
|
let compassOuterRingElm = document.getElementsByClassName('compass-outer-ring')[0]
|
|||
|
let navigationControlsElm = document.getElementsByClassName('navigation-controls')[0]
|
|||
|
compassOuterRingElm.addEventListener('mousedown', () => {
|
|||
|
closeRotateAround(this)
|
|||
|
closeViewFollow(this)
|
|||
|
})
|
|||
|
navigationControlsElm.addEventListener('mousedown', () => {
|
|||
|
closeRotateAround(this)
|
|||
|
closeViewFollow(this)
|
|||
|
})
|
|||
|
}, 0);
|
|||
|
|
|||
|
// this.viewer.dataSources.dataSourceMoved.addEventListener(()=>{
|
|||
|
// syncDataSources()
|
|||
|
// })
|
|||
|
// this.viewer.dataSources.dataSourceRemoved.addEventListener(()=>{
|
|||
|
// syncDataSources()
|
|||
|
// })
|
|||
|
|
|||
|
// 开启鼠标右键菜单
|
|||
|
// new mouseRightMenu(this, (e)=>{
|
|||
|
// console.log(e)
|
|||
|
// }).open()
|
|||
|
|
|||
|
// this.sdk.viewer.clock.onTick.addEventListener((clock) => {
|
|||
|
// this.sdk.viewer.scene.light = new Cesium.DirectionalLight({
|
|||
|
// direction: Cesium.Cartesian3.negate(this.sdk.viewer.scene.camera.position, new Cesium.Cartesian3()),
|
|||
|
// intensity: 0.5
|
|||
|
// })
|
|||
|
// });
|
|||
|
|
|||
|
this.viewer.imageryLayers.layerAdded.addEventListener(() => {
|
|||
|
for (let i = 0; i < this.viewer.imageryLayers._layers.length; i++) {
|
|||
|
if (
|
|||
|
this.viewer.imageryLayers._layers[i]._imageryProvider &&
|
|||
|
this.viewer.imageryLayers._layers[i]._imageryProvider._type &&
|
|||
|
(this.viewer.imageryLayers._layers[i]._imageryProvider._type ===
|
|||
|
'flw' ||
|
|||
|
this.viewer.imageryLayers._layers[i]._imageryProvider._type ===
|
|||
|
'jww')
|
|||
|
) {
|
|||
|
this.viewer.imageryLayers.raiseToTop(
|
|||
|
this.viewer.imageryLayers._layers[i]
|
|||
|
)
|
|||
|
}
|
|||
|
}
|
|||
|
})
|
|||
|
|
|||
|
// 开启地球阴影(可视域分析)
|
|||
|
// this.viewer.scene.globe.shadows = Cesium.ShadowMode.ENABLED
|
|||
|
|
|||
|
// let tools = new Tools()
|
|||
|
// tools.convertPxToRem(this)
|
|||
|
|
|||
|
// 更新光照
|
|||
|
function updateLight() {
|
|||
|
let intensity = 1
|
|||
|
if (
|
|||
|
_this.viewer &&
|
|||
|
_this.viewer.scene.mode === 2
|
|||
|
) {
|
|||
|
intensity = 10
|
|||
|
}
|
|||
|
if (_this.viewer.shadows) {
|
|||
|
_this.viewer.scene.light = new Cesium.SunLight()
|
|||
|
} else {
|
|||
|
if (_this.viewer.trackedEntity && _this.viewer.trackedEntity.position) {
|
|||
|
intensity = 1
|
|||
|
_this.viewer.scene.light = new Cesium.DirectionalLight({
|
|||
|
direction: Cesium.Cartesian3.negate(
|
|||
|
_this.viewer.trackedEntity.position._value,
|
|||
|
new Cesium.Cartesian3(-1, -1, -1)
|
|||
|
),
|
|||
|
intensity: intensity
|
|||
|
})
|
|||
|
} else {
|
|||
|
if (
|
|||
|
_this.viewer &&
|
|||
|
_this.viewer.scene.mode === 2
|
|||
|
) {
|
|||
|
intensity = 30
|
|||
|
}
|
|||
|
else {
|
|||
|
intensity = 1
|
|||
|
}
|
|||
|
_this.viewer.scene.light = new Cesium.DirectionalLight({
|
|||
|
direction: Cesium.Cartesian3.negate(
|
|||
|
_this.viewer.scene.camera.position,
|
|||
|
new Cesium.Cartesian3(-1, -1, -1)
|
|||
|
),
|
|||
|
intensity: intensity
|
|||
|
})
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
animateUpdate()
|
|||
|
function animateUpdate() {
|
|||
|
_this.#_requestAnimationFrameEventId = requestAnimationFrame(
|
|||
|
animateUpdate
|
|||
|
)
|
|||
|
updateLight()
|
|||
|
TWEEN.update()
|
|||
|
}
|
|||
|
|
|||
|
solveBug()
|
|||
|
function solveBug() {
|
|||
|
// 解决计算高度时多边形闪烁透视的bug,原因不明
|
|||
|
let pot1 = _this.viewer.entities.add(
|
|||
|
new Cesium.Entity({
|
|||
|
name: 'solve-bug',
|
|||
|
position: { x: 0, y: 0, z: 0 },
|
|||
|
billboard: {
|
|||
|
scale: 0,
|
|||
|
image: tools.getSourceRootPath() + '/img/point.png',
|
|||
|
color: Cesium.Color.WHITE.withAlpha(0)
|
|||
|
},
|
|||
|
})
|
|||
|
)
|
|||
|
let pot2 = _this.viewer.entities.add(
|
|||
|
new Cesium.Entity({
|
|||
|
name: 'solve-bug',
|
|||
|
position: { x: 0, y: 0, z: 100000000 },
|
|||
|
billboard: {
|
|||
|
scale: 0,
|
|||
|
image: tools.getSourceRootPath() + '/img/point.png',
|
|||
|
color: Cesium.Color.WHITE.withAlpha(0)
|
|||
|
},
|
|||
|
})
|
|||
|
)
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
destroy() {
|
|||
|
cancelAnimationFrame(this.#_requestAnimationFrameEventId)
|
|||
|
for (let [id, obj] of this.entityMap) {
|
|||
|
obj.remove()
|
|||
|
}
|
|||
|
|
|||
|
if (this.viewer) {
|
|||
|
if (this.viewer.entities) {
|
|||
|
this.viewer.entities.removeAll()
|
|||
|
}
|
|||
|
this.viewer.destroy && this.viewer.destroy()
|
|||
|
}
|
|||
|
this.viewer = null
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
export default YJEarth
|