| | |
| | | <template> |
| | | <div class="dimension-cut"> |
| | | <el-button type="primary">{{zoomValue}}</el-button> |
| | | <el-button |
| | | v-show="btnGroupShow" |
| | | size="mini" |
| | | class="three-stm" |
| | | type="primary" |
| | | @click="locationSTM" |
| | | >s3m</el-button> |
| | | |
| | | <el-button |
| | | v-show="btnGroupShow" |
| | | size="mini" |
| | | class="sat-stm" |
| | | type="primary" |
| | | @click="locationSAT" |
| | | >科技</el-button> |
| | | |
| | | <el-button |
| | | v-show="btnGroupShow" |
| | | size="mini" |
| | | class="sat-tc" |
| | | type="primary" |
| | | @click="locationTC" |
| | | >热力图</el-button> |
| | | |
| | | <el-radio-group v-model="dimensionValue" size="medium" @change="dimensionChange"> |
| | | <el-radio-button label="三 维"></el-radio-button> |
| | | <el-radio-button label="真三维"></el-radio-button> |
| | |
| | | |
| | | let select = null |
| | | |
| | | const wallLayer = null |
| | | let streenMlayer = null |
| | | |
| | | let layerSat = null |
| | | let layerSATtwo = null |
| | | let tcLayer = null |
| | | |
| | | let viewerHeight = 950 |
| | | let smallViewerHeight = 1950 |
| | | |
| | | const mixVH = 500 |
| | | const maxVH = 950 |
| | | const oneVH = 500 |
| | | const twoVH = 650 |
| | | const fourVH = 800 |
| | | const fiveVH = 950 |
| | | |
| | | // const wallLayer = null |
| | | |
| | | export default { |
| | | name: 'dimension', |
| | | data () { |
| | | return { |
| | | zoomValue: null, |
| | | btnGroupShow: false, |
| | | dimensionValue: '三 维', |
| | | // 建筑2.5D地图 |
| | | // 建筑2.5D面数据 |
| | |
| | | [114.03954722, 27.62819644, 100], |
| | | [114.04006133, 27.628038, 100] |
| | | ], |
| | | mapCenter: [115.871863, 28.743861, 400.0] |
| | | mapCenter: [116.35561302, |
| | | 27.96547549, 1860] |
| | | // mapCenter: [115.871863, 28.743861, 950.0] |
| | | } |
| | | }, |
| | | props: ['wheelFlag', 'startWheel', 'startSmallWheel'], |
| | | computed: { |
| | | ...mapGetters([ |
| | | 'viewerExist', |
| | |
| | | fileExtension: 'png' |
| | | // minimumLevel: 19 |
| | | })) |
| | | global.viewer.imageryLayers.addImageryProvider(new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({ |
| | | url: '/fz/{z}/{x}/{y}.png', |
| | | fileExtension: 'png' |
| | | // minimumLevel: 19 |
| | | })) |
| | | |
| | | // global.viewer.imageryLayers.addImageryProvider( |
| | | // new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({ |
| | | // url: 'http://arcgis.jxpskj.com:6080/arcgis/rest/services/FZ25DMap/MapServer/WMTS', |
| | | // // url: 'http://arcgis.jxpskj.com:6080/arcgis/rest/services/PX25DMap/Pingxiang25DMap18000/MapServer/WMTS', |
| | | // layer: 'fzsw2019', |
| | | // style: 'default', |
| | | // tileMatrixSetID: 'default028mm', |
| | | // format: 'image/jpgpng', |
| | | // tilingScheme: new global.DC.Namespace.Cesium.GeographicTilingScheme(), |
| | | // maximumLevel: 19, |
| | | // tileMatrixLabels: [ |
| | | // '0', |
| | | // '1', |
| | | // '2', |
| | | // '3', |
| | | // '4', |
| | | // '5', |
| | | // '6', |
| | | // '7', |
| | | // '8', |
| | | // '9', |
| | | // '10', |
| | | // '11', |
| | | // '12', |
| | | // '13', |
| | | // '14', |
| | | // '15', |
| | | // '16', |
| | | // '17', |
| | | // '18', |
| | | // '19' |
| | | // ] |
| | | // }) |
| | | // ) |
| | | |
| | | // global.viewer.imageryLayers.addImageryProvider(new global.DC.Namespace.Cesium.ArcGisMapServerImageryProvider({ |
| | | // url: 'http://arcgis.jxpskj.com:6080/arcgis/rest/services/FZ25DMap/MapServer', |
| | | // layer: 'fzsw2019', |
| | | // })) |
| | | |
| | | // wallLayer = new global.DC.VectorLayer('wallLayer') |
| | | // global.viewer.addLayer(wallLayer) |
| | |
| | | }) |
| | | |
| | | // 最小 |
| | | global.viewer.scene.screenSpaceCameraController.minimumZoomDistance = 100 |
| | | // 最大 |
| | | global.viewer.scene.screenSpaceCameraController.maximumZoomDistance = 400 |
| | | // global.viewer.scene.screenSpaceCameraController.minimumZoomDistance = mixVH |
| | | // global.eagleViewer.scene.screenSpaceCameraController.minimumZoomDistance = mixVH + 1000 |
| | | // // 最大 |
| | | // global.viewer.scene.screenSpaceCameraController.maximumZoomDistance = maxVH |
| | | // global.eagleViewer.scene.screenSpaceCameraController.maximumZoomDistance = maxVH + 1000 |
| | | |
| | | // 设置相机缩小时的速率 |
| | | global.viewer.scene.screenSpaceCameraController._minimumZoomRate = 2000 |
| | | // global.eagleViewer.scene.screenSpaceCameraController._minimumZoomRate = 2000 |
| | | // 设置相机放大时的速率 |
| | | global.viewer.scene.screenSpaceCameraController._maximumZoomRate = 5906376272000 |
| | | // global.eagleViewer.scene.screenSpaceCameraController._maximumZoomRate = 5906376272000 |
| | | // 视角平移 |
| | | global.viewer.scene.screenSpaceCameraController.enableRotate = true |
| | | global.eagleViewer.scene.screenSpaceCameraController.enableRotate = true |
| | | // 视角缩放 |
| | | global.viewer.scene.screenSpaceCameraController.enableZoom = true |
| | | global.eagleViewer.scene.screenSpaceCameraController.enableZoom = true |
| | | // 视角旋转 |
| | | global.viewer.scene.screenSpaceCameraController.enableTilt = false |
| | | global.eagleViewer.scene.screenSpaceCameraController.enableTilt = false |
| | | |
| | | that.createdLayers() |
| | | |
| | |
| | | } |
| | | }) |
| | | |
| | | document.querySelector('.dc-zoom-controller').children[1].onclick = |
| | | function () { |
| | | if (that.dimensionValue == '真三维') { |
| | | global.viewer.camera.setView({ |
| | | // Cesium的坐标是以地心为原点,一向指向南美洲,一向指向亚洲,一向指向北极州 |
| | | // fromDegrees()方法,将经纬度和高程转换为世界坐标 |
| | | destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees( |
| | | that.mapCenter[0], |
| | | that.mapCenter[1], |
| | | 220.0 |
| | | ), |
| | | orientation: { |
| | | // 指向 |
| | | heading: global.DC.Namespace.Cesium.Math.toRadians(-9), |
| | | // 视角 |
| | | pitch: global.DC.Namespace.Cesium.Math.toRadians(-34.54), |
| | | roll: 0.0 |
| | | } |
| | | }) |
| | | } else { |
| | | global.viewer.camera.setView({ |
| | | // Cesium的坐标是以地心为原点,一向指向南美洲,一向指向亚洲,一向指向北极州 |
| | | // fromDegrees()方法,将经纬度和高程转换为世界坐标 |
| | | destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees( |
| | | that.mapCenter[0], |
| | | that.mapCenter[1], |
| | | 400.0 |
| | | ), |
| | | orientation: { |
| | | // 指向 |
| | | heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // 视角 |
| | | pitch: global.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | roll: 0.0 |
| | | } |
| | | }) |
| | | } |
| | | } |
| | | // this.$nextTick(() => { |
| | | // document.querySelector('.dc-zoom-controller').children[1].onclick = |
| | | // function () { |
| | | // if (that.dimensionValue == '真三维') { |
| | | // global.viewer.camera.setView({ |
| | | // // Cesium的坐标是以地心为原点,一向指向南美洲,一向指向亚洲,一向指向北极州 |
| | | // // fromDegrees()方法,将经纬度和高程转换为世界坐标 |
| | | // destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees( |
| | | // that.mapCenter[0], |
| | | // that.mapCenter[1], |
| | | // 220.0 |
| | | // ), |
| | | // orientation: { |
| | | // // 指向 |
| | | // heading: global.DC.Namespace.Cesium.Math.toRadians(-9), |
| | | // // 视角 |
| | | // pitch: global.DC.Namespace.Cesium.Math.toRadians(-34.54), |
| | | // roll: 0.0 |
| | | // } |
| | | // }) |
| | | // } else { |
| | | // global.viewer.camera.setView({ |
| | | // // Cesium的坐标是以地心为原点,一向指向南美洲,一向指向亚洲,一向指向北极州 |
| | | // // fromDegrees()方法,将经纬度和高程转换为世界坐标 |
| | | // destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees( |
| | | // that.mapCenter[0], |
| | | // that.mapCenter[1], |
| | | // that.mapCenter[2] |
| | | // ), |
| | | // orientation: { |
| | | // // 指向 |
| | | // heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // // 视角 |
| | | // pitch: global.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | // roll: 0.0 |
| | | // } |
| | | // }) |
| | | // } |
| | | // } |
| | | |
| | | document.querySelector('.dc-zoom-controller').children[2].onclick = |
| | | function () { |
| | | if ( |
| | | that.dimensionValue != undefined && |
| | | that.dimensionValue != '真三维' |
| | | ) { |
| | | const height = Math.ceil( |
| | | global.viewer.camera.positionCartographic.height |
| | | ) |
| | | // document.querySelector('.dc-zoom-controller').children[2].onclick = |
| | | // function () { |
| | | // if ( |
| | | // that.dimensionValue != undefined && |
| | | // that.dimensionValue != '真三维' |
| | | // ) { |
| | | // if (viewerHeight == oneVH) { |
| | | // global.viewer.camera.setView({ |
| | | // destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians( |
| | | // global.viewer.camera.positionCartographic.longitude, |
| | | // global.viewer.camera.positionCartographic.latitude, |
| | | // twoVH |
| | | // ), |
| | | // orientation: { |
| | | // // 指向 |
| | | // heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // // 视角 |
| | | // pitch: global.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | // roll: 0.0 |
| | | // } |
| | | // }) |
| | | // viewerHeight = twoVH |
| | | // this.$emit('change-wheel', false, 'startWheel') |
| | | // return |
| | | // } |
| | | |
| | | if (height < 150) { |
| | | global.viewer.camera.setView({ |
| | | destination: |
| | | global.DC.Namespace.Cesium.Cartesian3.fromRadians( |
| | | global.viewer.camera.positionCartographic.longitude, |
| | | global.viewer.camera.positionCartographic.latitude, |
| | | 200 |
| | | ), |
| | | orientation: { |
| | | // 指向 |
| | | heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // 视角 |
| | | pitch: global.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | roll: 0.0 |
| | | } |
| | | }) |
| | | // if (viewerHeight == twoVH) { |
| | | // global.viewer.camera.setView({ |
| | | // destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians( |
| | | // global.viewer.camera.positionCartographic.longitude, |
| | | // global.viewer.camera.positionCartographic.latitude, |
| | | // fourVH |
| | | // ), |
| | | // orientation: { |
| | | // // 指向 |
| | | // heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // // 视角 |
| | | // pitch: global.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | // roll: 0.0 |
| | | // } |
| | | // }) |
| | | // viewerHeight = fourVH |
| | | // this.$emit('change-wheel', false, 'startWheel') |
| | | // return |
| | | // } |
| | | |
| | | return |
| | | } |
| | | // if (viewerHeight == fourVH) { |
| | | // global.viewer.camera.setView({ |
| | | // destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians( |
| | | // global.viewer.camera.positionCartographic.longitude, |
| | | // global.viewer.camera.positionCartographic.latitude, |
| | | // fiveVH |
| | | // ), |
| | | // orientation: { |
| | | // // 指向 |
| | | // heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // // 视角 |
| | | // pitch: global.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | // roll: 0.0 |
| | | // } |
| | | // }) |
| | | // viewerHeight = fiveVH |
| | | // this.$emit('change-wheel', false, 'startWheel') |
| | | // } |
| | | // } |
| | | // } |
| | | |
| | | if (height < 250) { |
| | | global.viewer.camera.setView({ |
| | | destination: |
| | | global.DC.Namespace.Cesium.Cartesian3.fromRadians( |
| | | global.viewer.camera.positionCartographic.longitude, |
| | | global.viewer.camera.positionCartographic.latitude, |
| | | 300 |
| | | ), |
| | | orientation: { |
| | | // 指向 |
| | | heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // 视角 |
| | | pitch: global.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | roll: 0.0 |
| | | } |
| | | }) |
| | | // document.querySelector('.dc-zoom-controller').children[0].onclick = |
| | | // function () { |
| | | // if ( |
| | | // that.dimensionValue != undefined && |
| | | // that.dimensionValue != '真三维' |
| | | // ) { |
| | | // if (viewerHeight == fiveVH) { |
| | | // global.viewer.camera.setView({ |
| | | // destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians( |
| | | // global.viewer.camera.positionCartographic.longitude, |
| | | // global.viewer.camera.positionCartographic.latitude, |
| | | // fourVH |
| | | // ), |
| | | // orientation: { |
| | | // // 指向 |
| | | // heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // // 视角 |
| | | // pitch: global.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | // roll: 0.0 |
| | | // } |
| | | // }) |
| | | // viewerHeight = fourVH |
| | | // this.$emit('change-wheel', false, 'startWheel') |
| | | // return |
| | | // } |
| | | |
| | | return |
| | | } |
| | | // if (viewerHeight == fourVH) { |
| | | // global.viewer.camera.setView({ |
| | | // destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians( |
| | | // global.viewer.camera.positionCartographic.longitude, |
| | | // global.viewer.camera.positionCartographic.latitude, |
| | | // twoVH |
| | | // ), |
| | | // orientation: { |
| | | // // 指向 |
| | | // heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // // 视角 |
| | | // pitch: global.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | // roll: 0.0 |
| | | // } |
| | | // }) |
| | | // viewerHeight = twoVH |
| | | // this.$emit('change-wheel', false, 'startWheel') |
| | | // return |
| | | // } |
| | | |
| | | if (height < 350) { |
| | | global.viewer.camera.setView({ |
| | | destination: |
| | | global.DC.Namespace.Cesium.Cartesian3.fromRadians( |
| | | global.viewer.camera.positionCartographic.longitude, |
| | | global.viewer.camera.positionCartographic.latitude, |
| | | 400 |
| | | ), |
| | | orientation: { |
| | | // 指向 |
| | | heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // 视角 |
| | | pitch: global.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | roll: 0.0 |
| | | } |
| | | }) |
| | | } |
| | | } |
| | | } |
| | | // if (viewerHeight == twoVH) { |
| | | // global.viewer.camera.setView({ |
| | | // destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians( |
| | | // global.viewer.camera.positionCartographic.longitude, |
| | | // global.viewer.camera.positionCartographic.latitude, |
| | | // oneVH |
| | | // ), |
| | | // orientation: { |
| | | // // 指向 |
| | | // heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // // 视角 |
| | | // pitch: global.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | // roll: 0.0 |
| | | // } |
| | | // }) |
| | | // viewerHeight = oneVH |
| | | // this.$emit('change-wheel', false, 'startWheel') |
| | | // } |
| | | // } |
| | | // } |
| | | // }) |
| | | |
| | | document.querySelector('.dc-zoom-controller').children[0].onclick = |
| | | function () { |
| | | if ( |
| | | that.dimensionValue != undefined && |
| | | that.dimensionValue != '真三维' |
| | | ) { |
| | | const height = Math.ceil( |
| | | global.viewer.camera.positionCartographic.height |
| | | ) |
| | | |
| | | if (height > 350) { |
| | | global.viewer.camera.setView({ |
| | | destination: |
| | | global.DC.Namespace.Cesium.Cartesian3.fromRadians( |
| | | global.viewer.camera.positionCartographic.longitude, |
| | | global.viewer.camera.positionCartographic.latitude, |
| | | 300 |
| | | ), |
| | | orientation: { |
| | | // 指向 |
| | | heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // 视角 |
| | | pitch: global.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | roll: 0.0 |
| | | } |
| | | }) |
| | | |
| | | return |
| | | } |
| | | |
| | | if (height > 250) { |
| | | global.viewer.camera.setView({ |
| | | destination: |
| | | global.DC.Namespace.Cesium.Cartesian3.fromRadians( |
| | | global.viewer.camera.positionCartographic.longitude, |
| | | global.viewer.camera.positionCartographic.latitude, |
| | | 200 |
| | | ), |
| | | orientation: { |
| | | // 指向 |
| | | heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // 视角 |
| | | pitch: global.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | roll: 0.0 |
| | | } |
| | | }) |
| | | |
| | | return |
| | | } |
| | | |
| | | if (height > 150) { |
| | | global.viewer.camera.setView({ |
| | | destination: |
| | | global.DC.Namespace.Cesium.Cartesian3.fromRadians( |
| | | global.viewer.camera.positionCartographic.longitude, |
| | | global.viewer.camera.positionCartographic.latitude, |
| | | 100 |
| | | ), |
| | | orientation: { |
| | | // 指向 |
| | | heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // 视角 |
| | | pitch: global.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | roll: 0.0 |
| | | } |
| | | }) |
| | | } |
| | | } |
| | | } |
| | | |
| | | global.viewer.on(global.DC.SceneEventType.CAMERA_CHANGED, that.mapCameraEvent) |
| | | // global.viewer.on(global.DC.SceneEventType.CAMERA_CHANGED, that.mapCameraEvent) |
| | | // global.eagleViewer.on(global.DC.SceneEventType.CAMERA_CHANGED, that.smallMapCameraEvent) |
| | | } |
| | | } |
| | | } |
| | | }, |
| | | methods: { |
| | | zoomToOpen () { |
| | | |
| | | }, |
| | | |
| | | locationSTM () { |
| | | global.viewer.flyToPosition('116.45793269658417,39.92711385557482,617.5967826044838,181.95219395269424,-21.286437065473546') |
| | | }, |
| | | |
| | | mouseMoveEvent (e) { |
| | | var that = this |
| | | |
| | | function heightToZoom (height) { |
| | | var A = 40487.57 |
| | | var B = 0.00007096758 |
| | | var C = 91610.74 |
| | | var D = -40467.74 |
| | | return Math.round(D + (A - D) / (1 + Math.pow(height / C, B))) |
| | | } |
| | | var height = Math.ceil(global.viewer.camera.positionCartographic.height) |
| | | var zoom = heightToZoom(height) |
| | | |
| | | that.zoomValue = zoom |
| | | |
| | | if (that.closeMapClick) { |
| | | return |
| | |
| | | }, |
| | | |
| | | mapCameraEvent () { |
| | | const height = Math.ceil( |
| | | global.viewer.camera.positionCartographic.height |
| | | ) |
| | | |
| | | global.viewer.camera.setView({ |
| | | orientation: { |
| | | // 指向 |
| | |
| | | } |
| | | }) |
| | | |
| | | if (height < 150) { |
| | | global.viewer.camera.setView({ |
| | | destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians( |
| | | global.viewer.camera.positionCartographic.longitude, |
| | | global.viewer.camera.positionCartographic.latitude, |
| | | 100 |
| | | ), |
| | | orientation: { |
| | | // 指向 |
| | | heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // 视角 |
| | | pitch: global.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | roll: 0.0 |
| | | } |
| | | }) |
| | | } |
| | | if (this.startWheel == false) return |
| | | |
| | | if (height > 150 && height <= 250) { |
| | | global.viewer.camera.setView({ |
| | | destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians( |
| | | global.viewer.camera.positionCartographic.longitude, |
| | | global.viewer.camera.positionCartographic.latitude, |
| | | 200 |
| | | ), |
| | | orientation: { |
| | | // 指向 |
| | | heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // 视角 |
| | | pitch: global.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | roll: 0.0 |
| | | } |
| | | }) |
| | | } |
| | | if (this.wheelFlag) { // 下 |
| | | if (viewerHeight == fiveVH) { |
| | | global.viewer.camera.setView({ |
| | | destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians( |
| | | global.viewer.camera.positionCartographic.longitude, |
| | | global.viewer.camera.positionCartographic.latitude, |
| | | fourVH |
| | | ), |
| | | orientation: { |
| | | // 指向 |
| | | heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // 视角 |
| | | pitch: global.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | roll: 0.0 |
| | | } |
| | | }) |
| | | viewerHeight = fourVH |
| | | this.$emit('change-wheel', false, 'startWheel') |
| | | return |
| | | } |
| | | |
| | | if (height > 250 && height <= 350) { |
| | | global.viewer.camera.setView({ |
| | | destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians( |
| | | global.viewer.camera.positionCartographic.longitude, |
| | | global.viewer.camera.positionCartographic.latitude, |
| | | 300 |
| | | ), |
| | | orientation: { |
| | | // 指向 |
| | | heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // 视角 |
| | | pitch: global.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | roll: 0.0 |
| | | } |
| | | }) |
| | | } |
| | | if (viewerHeight == fourVH) { |
| | | global.viewer.camera.setView({ |
| | | destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians( |
| | | global.viewer.camera.positionCartographic.longitude, |
| | | global.viewer.camera.positionCartographic.latitude, |
| | | twoVH |
| | | ), |
| | | orientation: { |
| | | // 指向 |
| | | heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // 视角 |
| | | pitch: global.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | roll: 0.0 |
| | | } |
| | | }) |
| | | viewerHeight = twoVH |
| | | this.$emit('change-wheel', false, 'startWheel') |
| | | return |
| | | } |
| | | |
| | | if (height > 350) { |
| | | global.viewer.camera.setView({ |
| | | destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians( |
| | | global.viewer.camera.positionCartographic.longitude, |
| | | global.viewer.camera.positionCartographic.latitude, |
| | | 400 |
| | | ), |
| | | orientation: { |
| | | // 指向 |
| | | heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // 视角 |
| | | pitch: global.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | roll: 0.0 |
| | | } |
| | | }) |
| | | if (viewerHeight == twoVH) { |
| | | global.viewer.camera.setView({ |
| | | destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians( |
| | | global.viewer.camera.positionCartographic.longitude, |
| | | global.viewer.camera.positionCartographic.latitude, |
| | | oneVH |
| | | ), |
| | | orientation: { |
| | | // 指向 |
| | | heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // 视角 |
| | | pitch: global.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | roll: 0.0 |
| | | } |
| | | }) |
| | | viewerHeight = oneVH |
| | | this.$emit('change-wheel', false, 'startWheel') |
| | | } |
| | | } else { // 上 |
| | | if (viewerHeight == oneVH) { |
| | | global.viewer.camera.setView({ |
| | | destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians( |
| | | global.viewer.camera.positionCartographic.longitude, |
| | | global.viewer.camera.positionCartographic.latitude, |
| | | twoVH |
| | | ), |
| | | orientation: { |
| | | // 指向 |
| | | heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // 视角 |
| | | pitch: global.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | roll: 0.0 |
| | | } |
| | | }) |
| | | viewerHeight = twoVH |
| | | this.$emit('change-wheel', false, 'startWheel') |
| | | return |
| | | } |
| | | |
| | | if (viewerHeight == twoVH) { |
| | | global.viewer.camera.setView({ |
| | | destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians( |
| | | global.viewer.camera.positionCartographic.longitude, |
| | | global.viewer.camera.positionCartographic.latitude, |
| | | fourVH |
| | | ), |
| | | orientation: { |
| | | // 指向 |
| | | heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // 视角 |
| | | pitch: global.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | roll: 0.0 |
| | | } |
| | | }) |
| | | viewerHeight = fourVH |
| | | this.$emit('change-wheel', false, 'startWheel') |
| | | return |
| | | } |
| | | |
| | | if (viewerHeight == fourVH) { |
| | | global.viewer.camera.setView({ |
| | | destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians( |
| | | global.viewer.camera.positionCartographic.longitude, |
| | | global.viewer.camera.positionCartographic.latitude, |
| | | fiveVH |
| | | ), |
| | | orientation: { |
| | | // 指向 |
| | | heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // 视角 |
| | | pitch: global.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | roll: 0.0 |
| | | } |
| | | }) |
| | | viewerHeight = fiveVH |
| | | this.$emit('change-wheel', false, 'startWheel') |
| | | } |
| | | } |
| | | }, |
| | | |
| | | smallMapCameraEvent () { |
| | | global.eagleViewer.camera.setView({ |
| | | orientation: { |
| | | // 指向 |
| | | heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // 视角 |
| | | pitch: global.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | roll: 0.0 |
| | | } |
| | | }) |
| | | |
| | | if (this.startSmallWheel == false) return |
| | | |
| | | if (this.wheelFlag) { // 下 |
| | | if (smallViewerHeight == fiveVH + 1000) { |
| | | global.eagleViewer.camera.setView({ |
| | | destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians( |
| | | global.eagleViewer.camera.positionCartographic.longitude, |
| | | global.eagleViewer.camera.positionCartographic.latitude, |
| | | fourVH + 1000 |
| | | ), |
| | | orientation: { |
| | | // 指向 |
| | | heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // 视角 |
| | | pitch: global.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | roll: 0.0 |
| | | } |
| | | }) |
| | | smallViewerHeight = fourVH + 1000 |
| | | this.$emit('change-wheel', false, 'startSmallWheel') |
| | | return |
| | | } |
| | | |
| | | if (smallViewerHeight == fourVH + 1000) { |
| | | global.eagleViewer.camera.setView({ |
| | | destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians( |
| | | global.eagleViewer.camera.positionCartographic.longitude, |
| | | global.eagleViewer.camera.positionCartographic.latitude, |
| | | twoVH + 1000 |
| | | ), |
| | | orientation: { |
| | | // 指向 |
| | | heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // 视角 |
| | | pitch: global.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | roll: 0.0 |
| | | } |
| | | }) |
| | | smallViewerHeight = twoVH + 1000 |
| | | this.$emit('change-wheel', false, 'startSmallWheel') |
| | | return |
| | | } |
| | | |
| | | if (smallViewerHeight == twoVH + 1000) { |
| | | global.eagleViewer.camera.setView({ |
| | | destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians( |
| | | global.eagleViewer.camera.positionCartographic.longitude, |
| | | global.eagleViewer.camera.positionCartographic.latitude, |
| | | oneVH + 1000 |
| | | ), |
| | | orientation: { |
| | | // 指向 |
| | | heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // 视角 |
| | | pitch: global.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | roll: 0.0 |
| | | } |
| | | }) |
| | | smallViewerHeight = oneVH + 1000 |
| | | this.$emit('change-wheel', false, 'startSmallWheel') |
| | | } |
| | | } else { // 上 |
| | | if (smallViewerHeight == oneVH + 1000) { |
| | | global.eagleViewer.camera.setView({ |
| | | destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians( |
| | | global.eagleViewer.camera.positionCartographic.longitude, |
| | | global.eagleViewer.camera.positionCartographic.latitude, |
| | | twoVH + 1000 |
| | | ), |
| | | orientation: { |
| | | // 指向 |
| | | heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // 视角 |
| | | pitch: global.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | roll: 0.0 |
| | | } |
| | | }) |
| | | smallViewerHeight = twoVH + 1000 |
| | | this.$emit('change-wheel', false, 'startSmallWheel') |
| | | return |
| | | } |
| | | |
| | | if (smallViewerHeight == twoVH + 1000) { |
| | | global.eagleViewer.camera.setView({ |
| | | destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians( |
| | | global.eagleViewer.camera.positionCartographic.longitude, |
| | | global.eagleViewer.camera.positionCartographic.latitude, |
| | | fourVH + 1000 |
| | | ), |
| | | orientation: { |
| | | // 指向 |
| | | heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // 视角 |
| | | pitch: global.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | roll: 0.0 |
| | | } |
| | | }) |
| | | smallViewerHeight = fourVH + 1000 |
| | | this.$emit('change-wheel', false, 'startSmallWheel') |
| | | return |
| | | } |
| | | |
| | | if (smallViewerHeight == fourVH + 1000) { |
| | | global.eagleViewer.camera.setView({ |
| | | destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians( |
| | | global.eagleViewer.camera.positionCartographic.longitude, |
| | | global.eagleViewer.camera.positionCartographic.latitude, |
| | | fiveVH + 1000 |
| | | ), |
| | | orientation: { |
| | | // 指向 |
| | | heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // 视角 |
| | | pitch: global.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | roll: 0.0 |
| | | } |
| | | }) |
| | | smallViewerHeight = fiveVH + 1000 |
| | | this.$emit('change-wheel', false, 'startSmallWheel') |
| | | } |
| | | } |
| | | }, |
| | | |
| | |
| | | } |
| | | }, |
| | | |
| | | locationSAT () { |
| | | global.viewer.flyToPosition('121.4941629,31.2091462,1859.56,0,-28.71') |
| | | }, |
| | | |
| | | locationTC () { |
| | | global.viewer.flyToPosition('120.670183527,31.348282115,109658.22,0,-89.90659095062371') |
| | | }, |
| | | |
| | | generatePosition (num) { |
| | | const list = [] |
| | | for (let i = 0; i < num; i++) { |
| | | const lng = 120.38105869 + Math.random() * 0.5 |
| | | const lat = 31.10115627 + Math.random() * 0.5 |
| | | list.push(new global.DC.Position(lng, lat)) |
| | | } |
| | | return list |
| | | }, |
| | | |
| | | removeTC () { |
| | | global.viewer.removeLayer(tcLayer) |
| | | tcLayer = null |
| | | }, |
| | | |
| | | createTC () { |
| | | tcLayer = new global.DC.HeatLayer('tcLayer', { |
| | | useGround: true, |
| | | radius: 40 |
| | | }) |
| | | global.viewer.addLayer(tcLayer) |
| | | const positions = this.generatePosition(3000) |
| | | tcLayer.setPositions(positions) |
| | | }, |
| | | |
| | | // 科技感删除 |
| | | removeSAT () { |
| | | global.viewer.removeLayer(layerSat) |
| | | global.viewer.removeLayer(layerSATtwo) |
| | | layerSat = null |
| | | layerSATtwo = null |
| | | }, |
| | | |
| | | // 科技感添加 |
| | | createSAT () { |
| | | function generatePosition (num, isAdd) { |
| | | const list = [] |
| | | for (let i = 0; i < num; i++) { |
| | | const lng = 121.49536592256028 + Math.random() * 0.04 * (isAdd ? 1 : -1) |
| | | const lat = 31.241616722278213 + Math.random() * 0.04 * (isAdd ? 1 : -1) |
| | | list.push({ lng, lat }) |
| | | } |
| | | return list |
| | | } |
| | | |
| | | layerSat = new global.DC.TilesetLayer('layerSat').addTo(global.viewer) |
| | | |
| | | const build = new global.DC.Tileset( |
| | | 'http://resource.dvgis.cn/data/3dtiles/ljz/tileset.json', |
| | | { skipLevels: true } |
| | | ) |
| | | |
| | | const fs = ` |
| | | varying vec3 v_positionEC; |
| | | void main(void){ |
| | | vec4 position = czm_inverseModelView * vec4(v_positionEC,1); // 位置 |
| | | float glowRange = 100.0; // 光环的移动范围(高度) |
| | | gl_FragColor = vec4(0.2, 0.5, 1.0, 1.0); // 颜色 |
| | | gl_FragColor *= vec4(vec3(position.z / 100.0), 1.0); // 渐变 |
| | | // 动态光环 |
| | | float time = fract(czm_frameNumber / 360.0); |
| | | time = abs(time - 0.5) * 2.0; |
| | | float diff = step(0.005, abs( clamp(position.z / glowRange, 0.0, 1.0) - time)); |
| | | gl_FragColor.rgb += gl_FragColor.rgb * (1.0 - diff); |
| | | } |
| | | ` |
| | | build.setCustomShader(fs) |
| | | |
| | | layerSat.addOverlay(build) |
| | | |
| | | layerSATtwo = new global.DC.PrimitiveLayer('layer').addTo(global.viewer) |
| | | |
| | | let positions = generatePosition(50, true) |
| | | |
| | | positions = positions.concat(generatePosition(50)) |
| | | |
| | | positions.forEach(item => { |
| | | const position = global.DC.Position.fromObject(item) |
| | | const end = position.copy() |
| | | end.alt = 5000 * Math.random() |
| | | const line = new global.DC.FlowLinePrimitive([position, end], 0.5) |
| | | line.setStyle({ |
| | | speed: 6 * Math.random(), |
| | | color: global.DC.Color.fromCssColorString('rgb(141,172,172)'), |
| | | percent: 0.1, |
| | | gradient: 0.01 |
| | | }) |
| | | layerSATtwo.addOverlay(line) |
| | | }) |
| | | }, |
| | | |
| | | dimensionChange () { |
| | | var that = this |
| | | |
| | | that.$store.commit('SET_TWOORTHREE', that.dimensionValue) |
| | | |
| | | if (that.dimensionValue == '真三维') { |
| | | that.btnGroupShow = true |
| | | that.createSAT() |
| | | that.createTC() |
| | | global.viewer.off(global.DC.MouseEventType.MOUSE_MOVE, that.mouseMoveEvent) |
| | | global.viewer.off(global.DC.SceneEventType.CAMERA_CHANGED, that.mapCameraEvent) |
| | | global.eagleViewer.off(global.DC.SceneEventType.CAMERA_CHANGED, that.smallMapCameraEvent) |
| | | that.removeLayers() |
| | | global.viewer.imageryLayers.remove(baseMapLayer) |
| | | baseMapLayer = null |
| | |
| | | tilesetLayer.addOverlay(tileset) |
| | | tileset.on(global.DC.MouseEventType.CLICK, that.tilesetClick) |
| | | tilesetLayer.show = true |
| | | |
| | | streenMlayer = new global.DC.S3MLayer('streenMlayer', 'http://resource.dvgis.cn/data/3dtiles/CBD/cbd.scp') |
| | | global.viewer.addLayer(streenMlayer) |
| | | // 最小 |
| | | global.viewer.scene.screenSpaceCameraController.minimumZoomDistance = 1.0 |
| | | global.eagleViewer.scene.screenSpaceCameraController.minimumZoomDistance = 1.0 |
| | | // 最大 |
| | | global.viewer.scene.screenSpaceCameraController.maximumZoomDistance = |
| | | Number.POSITIVE_INFINITY |
| | | global.eagleViewer.scene.screenSpaceCameraController.maximumZoomDistance = |
| | | Number.POSITIVE_INFINITY |
| | | // 视角旋转 |
| | | global.viewer.scene.screenSpaceCameraController.enableTilt = true |
| | | global.eagleViewer.scene.screenSpaceCameraController.enableTilt = true |
| | | // 115.877863,28.741661 |
| | | global.viewer.camera.setView({ |
| | | // Cesium的坐标是以地心为原点,一向指向南美洲,一向指向亚洲,一向指向北极州 |
| | |
| | | roll: 0.0 |
| | | } |
| | | }) |
| | | |
| | | global.eagleViewer.camera.setView({ |
| | | // Cesium的坐标是以地心为原点,一向指向南美洲,一向指向亚洲,一向指向北极州 |
| | | // fromDegrees()方法,将经纬度和高程转换为世界坐标 |
| | | destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees( |
| | | that.mapCenter[0], |
| | | that.mapCenter[1], |
| | | 1220.0 |
| | | ), |
| | | orientation: { |
| | | // 指向 |
| | | heading: global.DC.Namespace.Cesium.Math.toRadians(-9), |
| | | // 视角 |
| | | pitch: global.DC.Namespace.Cesium.Math.toRadians(-34.54), |
| | | roll: 0.0 |
| | | } |
| | | }) |
| | | } else { |
| | | that.btnGroupShow = false |
| | | that.removeSAT() |
| | | that.removeTC() |
| | | global.viewer.on(global.DC.MouseEventType.MOUSE_MOVE, that.mouseMoveEvent) |
| | | global.viewer.on(global.DC.SceneEventType.CAMERA_CHANGED, that.mapCameraEvent) |
| | | global.eagleViewer.on(global.DC.SceneEventType.CAMERA_CHANGED, that.smallMapCameraEvent) |
| | | tileset.off(global.DC.MouseEventType.CLICK, that.tilesetClick) |
| | | tilesetLayer.removeOverlay(tileset) |
| | | tilesetLayer.show = false |
| | | global.viewer.removeLayer(tilesetLayer) |
| | | tileset = null |
| | | tilesetLayer = null |
| | | global.viewer.removeLayer(streenMlayer) |
| | | streenMlayer = null |
| | | that.createdLayers() |
| | | |
| | | baseMapLayer = global.viewer.imageryLayers.addImageryProvider(new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({ |
| | |
| | | destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees( |
| | | that.mapCenter[0], |
| | | that.mapCenter[1], |
| | | 400.0 |
| | | that.mapCenter[2] |
| | | ), |
| | | orientation: { |
| | | // 指向 |
| | | heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // 视角 |
| | | pitch: global.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | roll: 0.0 |
| | | } |
| | | }) |
| | | |
| | | global.eagleViewer.camera.setView({ |
| | | // Cesium的坐标是以地心为原点,一向指向南美洲,一向指向亚洲,一向指向北极州 |
| | | // fromDegrees()方法,将经纬度和高程转换为世界坐标 |
| | | destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees( |
| | | that.mapCenter[0], |
| | | that.mapCenter[1], |
| | | maxVH + 1000 |
| | | ), |
| | | orientation: { |
| | | // 指向 |
| | |
| | | } |
| | | }) |
| | | // 最小 |
| | | global.viewer.scene.screenSpaceCameraController.minimumZoomDistance = 100 |
| | | global.viewer.scene.screenSpaceCameraController.minimumZoomDistance = mixVH |
| | | global.eagleViewer.scene.screenSpaceCameraController.minimumZoomDistance = mixVH + 1000 |
| | | // 最大 |
| | | global.viewer.scene.screenSpaceCameraController.maximumZoomDistance = 400 |
| | | global.viewer.scene.screenSpaceCameraController.maximumZoomDistance = maxVH |
| | | global.eagleViewer.scene.screenSpaceCameraController.maximumZoomDistance = maxVH + 1000 |
| | | // 视角旋转 |
| | | global.viewer.scene.screenSpaceCameraController.enableTilt = false |
| | | global.eagleViewer.scene.screenSpaceCameraController.enableTilt = false |
| | | } |
| | | } |
| | | } |
| | |
| | | // height: 40px; |
| | | z-index: 1; |
| | | } |
| | | |
| | | .three-stm { |
| | | position: fixed; |
| | | top: 66px; |
| | | right: 10px; |
| | | z-index: 99; |
| | | } |
| | | |
| | | .sat-stm { |
| | | position: fixed; |
| | | top: 66px; |
| | | right: 75px; |
| | | z-index: 99; |
| | | } |
| | | |
| | | .sat-tc { |
| | | position: fixed; |
| | | top: 66px; |
| | | right: 141px; |
| | | z-index: 99; |
| | | } |
| | | </style> |