| | |
| | | /dist |
| | | /public/mx |
| | | /public/wp |
| | | /public/fz |
| | | /public/base |
| | | |
| | | |
| | |
| | | <template> |
| | | <div class="dimension-cut"> |
| | | <el-button type="primary">{{zoomValue}}</el-button> |
| | | <el-button |
| | | v-show="btnGroupShow" |
| | | size="mini" |
| | |
| | | name: 'dimension', |
| | | data () { |
| | | return { |
| | | |
| | | zoomValue: null, |
| | | btnGroupShow: false, |
| | | dimensionValue: '三 维', |
| | | // 建筑2.5D地图 |
| | |
| | | [114.03954722, 27.62819644, 100], |
| | | [114.04006133, 27.628038, 100] |
| | | ], |
| | | mapCenter: [116.35381525, |
| | | 27.95839468, 950.0] |
| | | mapCenter: [116.35561302, |
| | | 27.96547549, 1860] |
| | | // mapCenter: [115.871863, 28.743861, 950.0] |
| | | } |
| | | }, |
| | |
| | | |
| | | videoLayer.addOverlay(cameraVideo) |
| | | |
| | | // baseMapLayer = |
| | | // global.viewer.imageryLayers.addImageryProvider(new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({ |
| | | // url: '/wp/{z}/{x}/{y}.png', |
| | | // fileExtension: 'png' |
| | | // // minimumLevel: 19 |
| | | // })) |
| | | baseMapLayer = |
| | | global.viewer.imageryLayers.addImageryProvider(new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({ |
| | | url: '/wp/{z}/{x}/{y}.png', |
| | | 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.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', |
| | |
| | | }) |
| | | |
| | | // 最小 |
| | | 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.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 |
| | |
| | | } |
| | | }) |
| | | |
| | | 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 |
| | | } |
| | | }) |
| | | } |
| | | } |
| | | // 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 != '真三维' |
| | | ) { |
| | | 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 |
| | | } |
| | | // 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 (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 == 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') |
| | | } |
| | | } |
| | | } |
| | | // 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') |
| | | // } |
| | | // } |
| | | // } |
| | | |
| | | 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 |
| | | } |
| | | // 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 |
| | | // } |
| | | |
| | | 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 (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 (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') |
| | | } |
| | | } |
| | | } |
| | | }) |
| | | // 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') |
| | | // } |
| | | // } |
| | | // } |
| | | // }) |
| | | |
| | | global.viewer.on(global.DC.SceneEventType.CAMERA_CHANGED, that.mapCameraEvent) |
| | | global.eagleViewer.on(global.DC.SceneEventType.CAMERA_CHANGED, that.smallMapCameraEvent) |
| | | // global.viewer.on(global.DC.SceneEventType.CAMERA_CHANGED, that.mapCameraEvent) |
| | | // global.eagleViewer.on(global.DC.SceneEventType.CAMERA_CHANGED, that.smallMapCameraEvent) |
| | | } |
| | | } |
| | | } |
| | |
| | | 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 |
| | | } |
| | |
| | | <template> |
| | | <div class="mobilePopupOurOnce"> |
| | | <div |
| | | class="mobilePopupOurOnce_center" |
| | | :style="{ |
| | | <div class="mobilePopupOurOnce"> |
| | | <div |
| | | class="mobilePopupOurOnce_center" |
| | | :style="{ |
| | | borderBottom: !ends ? '#d4d4d4 dashed 1px' : '', |
| | | marginBottom: !ends ? '6px' : '', |
| | | }" |
| | | > |
| | | <div class="mobilePopupOurOnce_left"> |
| | | <!-- <img :src="icon" alt="" :key="icon" /> --> |
| | | <el-image |
| | | style="width: 80px; height: 80px" |
| | | :src="icon" |
| | | :id="'mobileBigImgs' + icon + ''" |
| | | :preview-src-list="srcList" |
| | | > |
| | | <!-- v-show="false" --> |
| | | </el-image> |
| | | </div> |
| | | <div class="mobilePopupOurOnce_right" @click.self.stop="openOnce('定位')"> |
| | | <div |
| | | class="mobilePopupOurOnce_r_up" |
| | | @click.self.stop="openOnce('定位')" |
| | | > |
| | | {{ onceData.name }} |
| | | </div> |
| | | <div class="mobilePopupOurOnce_r_down"> |
| | | <div v-for="(item, index) in seebut" :key="index"> |
| | | <el-link |
| | | :icon=" |
| | | <div class="mobilePopupOurOnce_left"> |
| | | <!-- <img :src="icon" alt="" :key="icon" /> --> |
| | | <el-image |
| | | style="width: 80px; height: 80px" |
| | | :src="icon" |
| | | :id="'mobileBigImgs' + icon + ''" |
| | | :preview-src-list="srcList" |
| | | > |
| | | <!-- v-show="false" --> |
| | | </el-image> |
| | | </div> |
| | | <div class="mobilePopupOurOnce_right" @click.self.stop="openOnce('定位')"> |
| | | <div |
| | | class="mobilePopupOurOnce_r_up" |
| | | @click.self.stop="openOnce('定位')" |
| | | >{{ onceData.name }}</div> |
| | | <div class="mobilePopupOurOnce_r_down"> |
| | | <div v-for="(item, index) in seebut" :key="index"> |
| | | <el-link |
| | | :icon=" |
| | | item.name == '实景' |
| | | ? 'el-icon-place' |
| | | : item.name == '图集' |
| | |
| | | ? 'el-icon-map-location' |
| | | : '' |
| | | " |
| | | class="mobilePopupOurOnce_r_d_in" |
| | | @click="openOnce(item.name)" |
| | | >{{ item.name }}</el-link |
| | | > |
| | | <el-divider |
| | | direction="vertical" |
| | | class="mobilePopupOurOnce_r_d_in" |
| | | v-if="index != seebut.length - 1" |
| | | ></el-divider> |
| | | </div> |
| | | class="mobilePopupOurOnce_r_d_in" |
| | | @click="openOnce(item.name)" |
| | | >{{ item.name }}</el-link> |
| | | <el-divider |
| | | direction="vertical" |
| | | class="mobilePopupOurOnce_r_d_in" |
| | | v-if="index != seebut.length - 1" |
| | | ></el-divider> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import { mapGetters } from "vuex"; |
| | | import { getChildNavDetail } from "@/api/mobile/public/arc"; |
| | | import { mapGetters } from 'vuex' |
| | | import { getChildNavDetail } from '@/api/mobile/public/arc' |
| | | export default { |
| | | props: ["onceData", "ends"], |
| | | name: "mobilePopupOurOnce", |
| | | created() { |
| | | if (this.onceData.icon) { |
| | | this.srcList = this.onceData.icon; |
| | | this.icon = this.srcList[0]; |
| | | } |
| | | if (this.onceData.from == "校区建筑" || this.onceData.from == "文化风景") { |
| | | this.getOnceCampus(this.onceData.id); |
| | | } else { |
| | | this.ourData = this.onceData; |
| | | } |
| | | }, |
| | | data() { |
| | | return { |
| | | icon: "", |
| | | srcList: [], |
| | | ourData: {}, |
| | | }; |
| | | }, |
| | | computed: { |
| | | ...mapGetters(["mviewer"]), |
| | | seebut() { |
| | | const buts = this.onceData.buts; |
| | | let b = []; |
| | | for (const k in buts) { |
| | | if (buts[k] == "实景") { |
| | | continue; |
| | | props: ['onceData', 'ends'], |
| | | name: 'mobilePopupOurOnce', |
| | | created () { |
| | | if (this.onceData.icon) { |
| | | this.srcList = this.onceData.icon |
| | | this.icon = this.srcList[0] |
| | | } |
| | | b.push({ |
| | | name: buts[k], |
| | | }); |
| | | } |
| | | if (this.ourData.panoramaurl) { |
| | | b.push({ |
| | | name: "实景", |
| | | }); |
| | | } else { |
| | | b = b.filter((res) => { |
| | | return res.name != "实景"; |
| | | }); |
| | | } |
| | | return b; |
| | | }, |
| | | }, |
| | | methods: { |
| | | openOnce(val) { |
| | | if (!this.ourData.name) { |
| | | console.log("数据传输失败"); |
| | | return; |
| | | } |
| | | const that = this; |
| | | if (val == "定位") { |
| | | // 活动定位 |
| | | if (this.ourData.name == "活动") { |
| | | console.log(this.ourData); |
| | | return; |
| | | if (this.onceData.from == '校区建筑' || this.onceData.from == '文化风景') { |
| | | this.getOnceCampus(this.onceData.id) |
| | | } else { |
| | | this.ourData = this.onceData |
| | | } |
| | | // 随地图移动窗口 |
| | | this.$store.commit("MSET_BIGPOPUP", false); // 关闭全屏弹窗 |
| | | setTimeout(() => { |
| | | // // 定制化窗体 |
| | | const d = { |
| | | position: {}, |
| | | lntLat: that.ourData.lntLat, |
| | | query: { ...this.ourData, seebut: this.seebut }, |
| | | useJWD: true, // 仅使用经纬度 |
| | | from: "PopupOurOnce", |
| | | }; |
| | | that.$store.dispatch("setMobileWindows", d); |
| | | }, 500); |
| | | // 固定窗口 |
| | | // that.$store.dispatch("SET_OPENWIDOWFIXED", d); |
| | | } else if (val == "实景") { |
| | | this.$store.commit("MSET_OPENMOBILEPANORAMA", this.ourData.panoramaurl); |
| | | // if(this.ourData.panoramaurl){ |
| | | // } |
| | | // console.log(this.ourData.panoramaurl); |
| | | } else if (val == "图集") { |
| | | const imgsDom = document.getElementById( |
| | | "mobileBigImgs" + this.icon + "" |
| | | ); |
| | | imgsDom.click(); |
| | | } |
| | | }, |
| | | // "校区建筑"↓ |
| | | getOnceCampus(id) { |
| | | getChildNavDetail({ id: id }).then((res) => { |
| | | var result = res.data.data[0].list; |
| | | const d = { |
| | | name: result.mechanismname, |
| | | lntLat: [result.jd, result.wd], |
| | | alt: result.gd, |
| | | heading: result.heading, |
| | | pitch: result.pitch, |
| | | roll: result.roll, |
| | | bgImg: result.tpurl, |
| | | QRImg: result.codeurl, |
| | | websiteUrl: result.websiteurl, |
| | | telePhone: result.telephone, |
| | | address: result.address, |
| | | introduce: result.introduce, |
| | | video: result.videourl, |
| | | panoramaurl: result.panoramaurl, // 全景 |
| | | }; |
| | | this.ourData = d; |
| | | }); |
| | | data () { |
| | | return { |
| | | icon: '', |
| | | srcList: [], |
| | | ourData: {} |
| | | } |
| | | }, |
| | | // "校区建筑"↑ |
| | | }, |
| | | }; |
| | | computed: { |
| | | ...mapGetters(['mviewer']), |
| | | seebut () { |
| | | const buts = this.onceData.buts |
| | | let b = [] |
| | | for (const k in buts) { |
| | | if (buts[k] == '实景') { |
| | | continue |
| | | } |
| | | b.push({ |
| | | name: buts[k] |
| | | }) |
| | | } |
| | | if (this.ourData.panoramaurl) { |
| | | b.push({ |
| | | name: '实景' |
| | | }) |
| | | } else { |
| | | b = b.filter((res) => { |
| | | return res.name != '实景' |
| | | }) |
| | | } |
| | | return b |
| | | } |
| | | }, |
| | | methods: { |
| | | openOnce (val) { |
| | | console.log(this.ourData) |
| | | if (!this.ourData.name) { |
| | | console.log('数据传输失败') |
| | | return |
| | | } |
| | | const that = this |
| | | if (val == '定位') { |
| | | // 活动定位 |
| | | if (this.ourData.name == '活动') { |
| | | console.log(this.ourData) |
| | | return |
| | | } |
| | | // 随地图移动窗口 |
| | | this.$store.commit('MSET_BIGPOPUP', false) // 关闭全屏弹窗 |
| | | setTimeout(() => { |
| | | // // 定制化窗体 |
| | | const d = { |
| | | position: {}, |
| | | lntLat: that.ourData.lntLat, |
| | | query: { ...this.ourData, seebut: this.seebut }, |
| | | useJWD: true, // 仅使用经纬度 |
| | | from: 'PopupOurOnce' |
| | | } |
| | | that.$store.dispatch('setMobileWindows', d) |
| | | }, 500) |
| | | // 固定窗口 |
| | | // that.$store.dispatch("SET_OPENWIDOWFIXED", d); |
| | | } else if (val == '实景') { |
| | | this.$store.commit('MSET_OPENMOBILEPANORAMA', this.ourData.panoramaurl) |
| | | // if(this.ourData.panoramaurl){ |
| | | // } |
| | | // console.log(this.ourData.panoramaurl); |
| | | } else if (val == '图集') { |
| | | const imgsDom = document.getElementById( |
| | | 'mobileBigImgs' + this.icon + '' |
| | | ) |
| | | imgsDom.click() |
| | | } |
| | | }, |
| | | // "校区建筑"↓ |
| | | getOnceCampus (id) { |
| | | console.log(id) |
| | | getChildNavDetail({ id: id }).then((res) => { |
| | | console.log(res, 5656) |
| | | var result = res.data.data[0].list |
| | | const d = { |
| | | name: result.mechanismname, |
| | | lntLat: [result.jd, result.wd], |
| | | alt: result.gd, |
| | | heading: result.heading, |
| | | pitch: result.pitch, |
| | | roll: result.roll, |
| | | bgImg: result.tpurl, |
| | | QRImg: result.codeurl, |
| | | websiteUrl: result.websiteurl, |
| | | telePhone: result.telephone, |
| | | address: result.address, |
| | | introduce: result.introduce, |
| | | video: result.videourl, |
| | | panoramaurl: result.panoramaurl // 全景 |
| | | } |
| | | this.ourData = d |
| | | }) |
| | | } |
| | | // "校区建筑"↑ |
| | | } |
| | | } |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | // 继承类 |
| | | .flexCenter { |
| | | display: flex !important; |
| | | align-items: center !important; |
| | | justify-content: center !important; |
| | | display: flex !important; |
| | | align-items: center !important; |
| | | justify-content: center !important; |
| | | } |
| | | .mobilePopupOurOnce { |
| | | padding: 8px 0 0 0; |
| | | margin: 0 8px; |
| | | // background-image: linear-gradient(#29baf1, #28bbf0); |
| | | .mobilePopupOurOnce_center { |
| | | // margin-bottom: 8px; |
| | | height: 80px; |
| | | // border-bottom: #d4d4d4 dashed 1px; |
| | | padding-bottom: 8px; |
| | | @extend .flexCenter; |
| | | .mobilePopupOurOnce_left { |
| | | width: 32%; |
| | | height: 100%; |
| | | @extend .flexCenter; |
| | | img { |
| | | width: 80px; |
| | | padding: 8px 0 0 0; |
| | | margin: 0 8px; |
| | | // background-image: linear-gradient(#29baf1, #28bbf0); |
| | | .mobilePopupOurOnce_center { |
| | | // margin-bottom: 8px; |
| | | height: 80px; |
| | | } |
| | | } |
| | | .mobilePopupOurOnce_right { |
| | | width: 68%; |
| | | height: 100%; |
| | | @extend .flexCenter; |
| | | flex-direction: column; |
| | | .mobilePopupOurOnce_r_up { |
| | | height: 50%; |
| | | width: 100%; |
| | | font-size: 16px; |
| | | text-indent: 1em; |
| | | display: flex !important; |
| | | align-items: center !important; |
| | | // color: #fff; |
| | | } |
| | | .mobilePopupOurOnce_r_down { |
| | | height: 50%; |
| | | width: 100%; |
| | | padding-left: 1em; |
| | | display: flex !important; |
| | | align-items: center !important; |
| | | .mobilePopupOurOnce_r_d_in { |
| | | // color: #fff; |
| | | font-size: 17px; |
| | | // border-bottom: #d4d4d4 dashed 1px; |
| | | padding-bottom: 8px; |
| | | @extend .flexCenter; |
| | | .mobilePopupOurOnce_left { |
| | | width: 32%; |
| | | height: 100%; |
| | | @extend .flexCenter; |
| | | img { |
| | | width: 80px; |
| | | height: 80px; |
| | | } |
| | | } |
| | | } |
| | | .mobilePopupOurOnce_right { |
| | | width: 68%; |
| | | height: 100%; |
| | | @extend .flexCenter; |
| | | flex-direction: column; |
| | | .mobilePopupOurOnce_r_up { |
| | | height: 50%; |
| | | width: 100%; |
| | | font-size: 16px; |
| | | text-indent: 1em; |
| | | display: flex !important; |
| | | align-items: center !important; |
| | | // color: #fff; |
| | | } |
| | | .mobilePopupOurOnce_r_down { |
| | | height: 50%; |
| | | width: 100%; |
| | | padding-left: 1em; |
| | | display: flex !important; |
| | | align-items: center !important; |
| | | .mobilePopupOurOnce_r_d_in { |
| | | // color: #fff; |
| | | font-size: 17px; |
| | | } |
| | | } |
| | | } |
| | | } |
| | | } |
| | | } |
| | | </style> |
| | |
| | | const CompressionPlugin = require('compression-webpack-plugin') |
| | | |
| | | module.exports = { |
| | | publicPath: '/', |
| | | lintOnSave: false, |
| | | // 其他配置 |
| | | chainWebpack: (config) => { |
| | | config.plugin('copy').use(CopywebpackPlugin, [ |
| | | [ |
| | | { |
| | | from: path.join(dvgisDist, 'dc-sdk/dist/resources'), |
| | | to: 'libs/dc-sdk/resources' |
| | | }, |
| | | { |
| | | from: './public/img', |
| | | to: 'img' |
| | | }, |
| | | { |
| | | from: './public/examples', |
| | | to: 'examples' |
| | | }, |
| | | { |
| | | from: './public/mx', |
| | | to: 'mx' |
| | | }, |
| | | { |
| | | from: './public/wp', |
| | | to: 'wp' |
| | | }, |
| | | { |
| | | from: './public/favicon.ico', |
| | | to: 'favicon.ico' |
| | | } |
| | | ] |
| | | ]) |
| | | }, |
| | | // 减少chunk-vendors.js文件大小 |
| | | // 报错 TypeError: Cannot read property 'tapPromise' of undefined |
| | | // 解决 ,把compression-webpack-plugin包退回成 compression-webpack-plugin@5.0.1 即可 |
| | | // 文件由8M 减成2.5M |
| | | productionSourceMap: false, // 代码压缩加密 |
| | | configureWebpack: { |
| | | // webpack plugins |
| | | plugins: [ |
| | | // 提供带 Content-Encoding 编码的压缩版的资源 |
| | | new CompressionPlugin({ |
| | | algorithm: 'gzip', |
| | | test: /\.js$|\.html$|\.css/, // 匹配文件名 |
| | | // test: /\.(js|css)$/, |
| | | threshold: 10240, // 对超过10k的数据压缩 |
| | | deleteOriginalAssets: false, // 不删除源文件 |
| | | minRatio: 0.8 // 压缩比 |
| | | }) |
| | | ] |
| | | } |
| | | publicPath: '/', |
| | | lintOnSave: false, |
| | | // 其他配置 |
| | | chainWebpack: (config) => { |
| | | config.plugin('copy').use(CopywebpackPlugin, [ |
| | | [ |
| | | { |
| | | from: path.join(dvgisDist, 'dc-sdk/dist/resources'), |
| | | to: 'libs/dc-sdk/resources' |
| | | }, |
| | | { |
| | | from: './public/img', |
| | | to: 'img' |
| | | }, |
| | | { |
| | | from: './public/examples', |
| | | to: 'examples' |
| | | }, |
| | | { |
| | | from: './public/mx', |
| | | to: 'mx' |
| | | }, |
| | | { |
| | | from: './public/fz', |
| | | to: 'fz' |
| | | }, |
| | | { |
| | | from: './public/wp', |
| | | to: 'wp' |
| | | }, |
| | | { |
| | | from: './public/favicon.ico', |
| | | to: 'favicon.ico' |
| | | } |
| | | ] |
| | | ]) |
| | | }, |
| | | // 减少chunk-vendors.js文件大小 |
| | | // 报错 TypeError: Cannot read property 'tapPromise' of undefined |
| | | // 解决 ,把compression-webpack-plugin包退回成 compression-webpack-plugin@5.0.1 即可 |
| | | // 文件由8M 减成2.5M |
| | | productionSourceMap: false, // 代码压缩加密 |
| | | configureWebpack: { |
| | | // webpack plugins |
| | | plugins: [ |
| | | // 提供带 Content-Encoding 编码的压缩版的资源 |
| | | new CompressionPlugin({ |
| | | algorithm: 'gzip', |
| | | test: /\.js$|\.html$|\.css/, // 匹配文件名 |
| | | // test: /\.(js|css)$/, |
| | | threshold: 10240, // 对超过10k的数据压缩 |
| | | deleteOriginalAssets: false, // 不删除源文件 |
| | | minRatio: 0.8 // 压缩比 |
| | | }) |
| | | ] |
| | | } |
| | | } |