| | |
| | | style="height: 100%; width: 100%;" |
| | | @click="mapClick($event)"> |
| | | |
| | | <div style=" |
| | | position: fixed; |
| | | left: 4px; |
| | | bottom: 4px; |
| | | width: 80px; |
| | | line-height: 24px; |
| | | text-align: center; |
| | | color: #fff; |
| | | font-size: 14px; |
| | | border-radius: 4px; |
| | | background: rgba(0, 0, 0, .9); |
| | | z-index: 11; |
| | | "> |
| | | 智慧校园 |
| | | </div> |
| | | |
| | | <dimension /> |
| | | |
| | | <left-nav ref="leftNav"></left-nav> |
| | |
| | | </template> |
| | | <script> |
| | | |
| | | import axios from 'axios' |
| | | import { mapGetters } from 'vuex' |
| | | import mapPopup from './components/mapPopup.vue' |
| | | import campusBuildingSearch from './components/campusBuildingSearch.vue' |
| | |
| | | |
| | | that.$store.commit('SET_VIEWER', viewer) |
| | | |
| | | viewer.on(that.DC.SceneEventType.CAMERA_CHANGED, (e) => { |
| | | const height = Math.ceil(viewer.camera.positionCartographic.height) |
| | | |
| | | if (height < 100) { |
| | | viewer.camera.setView({ |
| | | destination: that.DC.Namespace.Cesium.Cartesian3.fromRadians(viewer.camera.positionCartographic.longitude, viewer.camera.positionCartographic.latitude, 100), |
| | | orientation: { |
| | | // 指向 |
| | | heading: that.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // 视角 |
| | | pitch: that.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | roll: 0.0 |
| | | } |
| | | }) |
| | | }; |
| | | if (height > 600000) { |
| | | viewer.camera.setView({ |
| | | destination: that.DC.Namespace.Cesium.Cartesian3.fromRadians(viewer.camera.positionCartographic.longitude, viewer.camera.positionCartographic.latitude, 600000), |
| | | orientation: { |
| | | // 指向 |
| | | heading: that.DC.Namespace.Cesium.Math.toRadians(0, 0), |
| | | // 视角 |
| | | pitch: that.DC.Namespace.Cesium.Math.toRadians(-90), |
| | | roll: 0.0 |
| | | } |
| | | }) |
| | | } |
| | | }) |
| | | |
| | | // 最小 |
| | | viewer.scene.screenSpaceCameraController.minimumZoomDistance = 500 |
| | | // 最大 |
| | | viewer.scene.screenSpaceCameraController.maximumZoomDistance = 600000 |
| | | // 设置相机缩小时的速率 |
| | | viewer.scene.screenSpaceCameraController._minimumZoomRate = 30000 |
| | | // 设置相机放大时的速率 |
| | | viewer.scene.screenSpaceCameraController._maximumZoomRate = 5906376272000 |
| | | // 视角平移 |
| | | viewer.scene.screenSpaceCameraController.enableRotate = true |
| | | // 视角缩放 |
| | | viewer.scene.screenSpaceCameraController.enableZoom = true |
| | | // 视角旋转 |
| | | viewer.scene.screenSpaceCameraController.enableTilt = false |
| | | |
| | | that.$refs.leftNav.initialize(viewer) |
| | | |
| | | // const baselayer = that.DC.ImageryLayerFactory.createImageryLayer(that.DC.ImageryType.XYZ, { |
| | |
| | | ) |
| | | |
| | | const arcgisLayer = that.DC.ImageryLayerFactory.createArcGisImageryLayer({ |
| | | url: 'http://59.55.128.156:6080/arcgis/rest/services/fzhl/MapServer' |
| | | url: 'http://59.55.128.156:6080/arcgis/rest/services/xiajiangfhgc/MapServer' |
| | | }) |
| | | |
| | | viewer.addBaseLayer(baselayer, { |
| | |
| | | |
| | | viewer.imageryLayers.addImageryProvider(arcgisLayer) |
| | | |
| | | const areaLayer = new that.DC.VectorLayer('areaLayer') |
| | | |
| | | viewer.addLayer(areaLayer) |
| | | |
| | | axios.get('http://59.55.128.156:6080/arcgis/rest/services/xiajiangfhgc/MapServer/4/query?where=1%3D1&text=&objectIds=&time=&geometry=&geometryType=esriGeometryEnvelope&inSR=&spatialRel=esriSpatialRelIntersects&relationParam=&outFields=*&returnGeometry=true&maxAllowableOffset=&geometryPrecision=&outSR=&returnIdsOnly=false&returnCountOnly=false&orderByFields=&groupByFieldsForStatistics=&outStatistics=&returnZ=false&returnM=false&gdbVersion=&returnDistinctValues=false&returnTrueCurves=false&resultOffset=&resultRecordCount=&f=pjson').then(resultData => { |
| | | resultData.data.features.forEach(item => { |
| | | item.geometry.rings[0].forEach(it => { |
| | | it = it.join(',') |
| | | }) |
| | | |
| | | item.geometry.rings[0] = item.geometry.rings[0].join(';') |
| | | |
| | | const polygon = new that.DC.Polygon(item.geometry.rings[0]) |
| | | |
| | | polygon.setStyle({ |
| | | |
| | | material: that.DC.Namespace.Cesium.Color.fromBytes(255, 255, 255, 0) |
| | | |
| | | }) |
| | | |
| | | areaLayer.addOverlay(polygon) |
| | | }) |
| | | }) |
| | | |
| | | var select = { |
| | | overlay: undefined, |
| | | color: undefined |
| | | } |
| | | |
| | | viewer.on(that.DC.MouseEventType.MOUSE_MOVE, e => { |
| | | if (e.overlay != undefined) { |
| | | if (select.overlay != undefined) { |
| | | if (e.overlay != select.overlay) { |
| | | select.overlay.setStyle({ |
| | | material: select.color |
| | | }) |
| | | |
| | | select.overlay = undefined |
| | | select.color = undefined |
| | | } |
| | | } |
| | | |
| | | if (select.overlay == undefined) { |
| | | select.overlay = e.overlay |
| | | |
| | | select.color = e.overlay._style.material |
| | | select.overlay.setStyle({ |
| | | |
| | | material: that.DC.Namespace.Cesium.Color.fromBytes(32, 108, 247, 158) |
| | | |
| | | }) |
| | | } |
| | | } else { |
| | | if (select.overlay != undefined) { |
| | | select.overlay.setStyle({ |
| | | material: select.color |
| | | }) |
| | | |
| | | select.overlay = undefined |
| | | select.color = undefined |
| | | } |
| | | } |
| | | }) |
| | | |
| | | viewer.on(that.DC.MouseEventType.CLICK, e => { |
| | | if (e.overlay != undefined) { |
| | | console.log(e.overlay.attr) |
| | | } |
| | | }) |
| | | |
| | | // viewer.addBaseLayer(baselayer, { |
| | | // iconUrl: 'examples/images/icon/img.png', |
| | | // name: '影像' |