shuishen
2022-01-04 b23993b436146d31849d0a6d6b65d01786bea189
src/components/map/index.vue
@@ -4,6 +4,22 @@
         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>
@@ -21,6 +37,7 @@
</template>
<script>
import axios from 'axios'
import { mapGetters } from 'vuex'
import mapPopup from './components/mapPopup.vue'
import campusBuildingSearch from './components/campusBuildingSearch.vue'
@@ -140,50 +157,6 @@
            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, {
@@ -199,7 +172,7 @@
            )
            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, {
@@ -208,6 +181,76 @@
            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: '影像'