shuishen
2022-04-27 510ae9f8768cd16c39fde70e1ae40b164500d5d5
src/components/mobilemap/index.vue
@@ -42,25 +42,24 @@
let baseLayer = []
var baseLayers = []
let viewerHeight = 500
let heightChange = 500
// baselayer
window.baselayer = null
let tilesetLayer = null
let tileset = null
let silhouetteBlue = null
window.conBack = null
window.tilesetLayer = null
window.tileset = null
window.silhouetteBlue = null
window.highlighted = null
window.selected = null
window.usetowpointfive = null
window.provider = null
window.newLayer = null
window.layerGroup = null
window.areaLayer = null
window.polygon = null
window.doit2 = null
window.wallLayer = null
window.initViewer = null // 主方法
window.height1s = null
@@ -69,6 +68,10 @@
    name: 'mobilemapBox',
    data () {
        return {
            // 首次
            titlesetLayerFlag: false,
            // 确认viewer是否创建好
            viewerExist: false,
            // 手动视图缩放控制
            heights: 0,
            heights1: 0,
@@ -141,6 +144,7 @@
        ...mapGetters([
            // "mviewer",
            // "MobileWindowsHide",
            'zoomRange',
            'mBigPopup',
            // "mBigPopupAfter",
            'iconHide',
@@ -162,6 +166,422 @@
                this.bigPopup.width = '0'
                this.bigPopup.height = '0'
                this.bigPopup.display = 'none'
            }
        },
        viewerExist: {
            immediate: true,
            handler (newCode, oldCode) {
                const that = this
                if (that.titlesetLayerFlag == false && newCode == true) {
                    global.viewer.imageryLayers.addImageryProvider(new global.DC.Namespace.Cesium.SingleTileImageryProvider({
                        url: '/img/bg/map.jpg'
                    }))
                    silhouetteBlue =
                        global.DC.Namespace.Cesium.PostProcessStageLibrary.createEdgeDetectionStage()
                    silhouetteBlue.uniforms.color =
                        global.DC.Namespace.Cesium.Color.fromBytes(9, 162, 40)
                    silhouetteBlue.uniforms.length = 0.01
                    silhouetteBlue.selected = []
                    global.viewer.scene.postProcessStages.add(
                        global.DC.Namespace.Cesium.PostProcessStageLibrary.createSilhouetteStage(
                            [silhouetteBlue]
                        )
                    )
                    // 判断默认维度
                    // 原本默认是2.5d  改为3d默认时做出改变
                    that.$store.commit('set_frislayertHeight', that.frislayertHeight) // 送入默认弹窗高度
                    that.$store.commit('set_zoomRange', [
                        that.onelayerNum,
                        // that.fourlayerNum ? that.fourlayerNum : that.threelayerNum,
                        that.fivelayerNum,
                        that.useZoom,
                        that.addOthers
                    ])
                    global.viewer.flyToPosition(
                        new global.DC.Position(
                            that.mapCenter[0],
                            that.mapCenter[1],
                            that.frislayertHeight,
                            that.dimensionData.heading,
                            that.dimensionData.pitch,
                            that.dimensionData.roll
                        ),
                        () => {
                            baseLayerImgUrl.forEach((item, index) => {
                                var obj = {}
                                obj[Object.keys(item)[0]] = []
                                Object.values(item)[0].forEach(citem => {
                                    var layer = new global.DC.Namespace.Cesium.SingleTileImageryProvider({
                                        url: citem.url,
                                        rectangle: global.DC.Namespace.Cesium.Rectangle.fromDegrees(citem.rectangle[0], citem.rectangle[1], citem.rectangle[2], citem.rectangle[3])
                                    })
                                    obj[Object.keys(item)[0]].push({ layer, id: citem.id + Object.keys(item)[0], rectangle: citem.rectangle })
                                })
                                baseLayers.push(obj)
                            })
                            that.addBaseLayer()
                        },
                        0
                    )
                    // 2.5D视角限制
                    global.viewer.scene.screenSpaceCameraController.minimumZoomDistance = that.zoomRange[0]
                    // 最大
                    global.viewer.scene.screenSpaceCameraController.maximumZoomDistance = that.zoomRange[1]
                    // 设置相机缩小时的速率
                    global.viewer.scene.screenSpaceCameraController._minimumZoomRate = 2000
                    // 设置相机放大时的速率
                    global.viewer.scene.screenSpaceCameraController._maximumZoomRate = 5906376272000
                    // 视角平移
                    global.viewer.scene.screenSpaceCameraController.enableRotate = true
                    // 视角缩放
                    global.viewer.scene.screenSpaceCameraController.enableZoom = true
                    // 视角旋转
                    global.viewer.scene.screenSpaceCameraController.enableTilt = false
                    that.$refs.mobileLeftNav.initialize()
                    // that.$store.commit("MSET_VIEWER", viewer);
                    // window.mviewer = viewer;
                    // that.$store.commit("MSET_DC", DC);
                    global.viewer.popup.hide()
                    window.highlighted = {
                        feature: undefined,
                        originalColor: new global.DC.Namespace.Cesium.Color()
                    }
                    window.selected = {
                        feature: undefined,
                        originalColor: new global.DC.Namespace.Cesium.Color()
                    }
                    window.layerGroup = new global.DC.LayerGroup('modelBox')
                    global.viewer.addLayerGroup(window.layerGroup)
                    window.areaLayer = new global.DC.VectorLayer('areaLayer')
                    window.layerGroup.addLayer(window.areaLayer)
                    axios
                        .get(
                            'http://arcgis.jxpskj.com:6080/arcgis/rest/services/lxxqwxq/MapServer/0/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(';')
                                window.polygon = new global.DC.Polygon(item.geometry.rings[0])
                                window.polygon.attr = item.attributes
                                window.polygon.setStyle({
                                    material: global.DC.Namespace.Cesium.Color.fromBytes(
                                        255,
                                        255,
                                        255,
                                        1
                                    )
                                })
                                window.areaLayer.addOverlay(window.polygon)
                            })
                            window.areaLayer.show = true
                        })
                    that.$store.commit('MSET_areaLayer', window.areaLayer)
                    // 判断是否有url参数
                    // console.log(that.urlParameterData);
                    if (typeof that.urlParameterData != 'string') {
                        // console.log(that.urlParameterData);
                        that.$store.commit('initurlParameterLayer') // 初始化自定义标签图层
                        if (that.urlParameterData.methods == 'goto') {
                            // url有定位的参数
                            // alert(that.urlParameterData.jd);
                            // alert(that.urlParameterData.wd);
                            // 创建标记
                            const dsa = {
                                list: [
                                    {
                                        name: that.urlParameterData.name || '无标题',
                                        jd: that.urlParameterData.jd,
                                        wd: that.urlParameterData.wd
                                    }
                                ],
                                clear: true
                            }
                            that.$store.dispatch('addurlParameterLayerIcon', dsa)
                            // that.flytos(
                            //   //飞入标记
                            //   +that.urlParameterData.jd + 0.012,
                            //   +that.urlParameterData.wd
                            // );
                            const d = {
                                position: {},
                                lntLat: [+that.urlParameterData.jd, +that.urlParameterData.wd],
                                query: {
                                    introduce: '暂无内容',
                                    address: '',
                                    ...(that.urlParameterData || {}),
                                    lntLat: [+that.urlParameterData.jd, +that.urlParameterData.wd]
                                },
                                useJWD: true // 仅使用经纬度
                            }
                            that.$store.dispatch('setMobileWindows', d)
                        } else if (that.urlParameterData.methods == 'arc') {
                            const objInit = {
                                name: that.urlParameterData.mechanismname,
                                lntLat: [that.urlParameterData.jd, that.urlParameterData.wd],
                                alt: that.urlParameterData.gd,
                                heading: that.urlParameterData.heading,
                                pitch: that.urlParameterData.pitch,
                                roll: that.urlParameterData.roll,
                                bgImg: that.urlParameterData.tpurl,
                                QRImg: that.urlParameterData.codeurl,
                                websiteUrl: that.urlParameterData.websiteurl,
                                telePhone: that.urlParameterData.telephone,
                                address: that.urlParameterData.address,
                                introduce: that.urlParameterData.introduce,
                                video: that.urlParameterData.videourl,
                                panoramaurl: that.urlParameterData.panoramaurl // 全景
                            }
                            const dataInitialization = {
                                position: {},
                                lntLat: objInit.lntLat,
                                query: { ...objInit },
                                useJWD: true // 仅使用经纬度
                                // from: 'PopupOurOnce'
                            }
                            that.$store.dispatch('setMobileWindows', dataInitialization)
                        }
                    }
                    // 地图移动事件
                    global.viewer.on(global.DC.MouseEventType.MOUSE_MOVE, (e) => {
                        if (!that.iconHide) {
                            that.$store.commit('MSET_ICONHIDE', true)
                        }
                        // if (!that.MobileWindowsHide) {
                        // that.$store.dispatch("closeMobileWindowsDom"); //关闭随地图弹窗
                        // }
                        // let height = Math.ceil(global.viewer.camera.positionCartographic.height);
                        // console.log(height);
                    })
                    // 地图点击事件
                    global.viewer.on(global.DC.MouseEventType.CLICK, (e) => {
                        // console.log(e);
                        if (e.overlay != undefined && e.layer.id == 'areaLayer') {
                            if (window.select.overlay != undefined) {
                                if (e.overlay != window.select.overlay) {
                                    window.select.overlay.setStyle({
                                        material: window.select.color,
                                        outline: false
                                    })
                                    that.$store.commit('mset_changeSelect', [undefined, undefined])
                                }
                            }
                            if (window.select.overlay == undefined) {
                                window.select.overlay = e.overlay
                                window.select.color = e.overlay._style.material
                                window.select.overlay.setStyle({
                                    outline: true,
                                    outlineColor: global.DC.Namespace.Cesium.Color.fromBytes(
                                        3,
                                        255,
                                        13,
                                        255
                                    ), // 边框颜色
                                    outlineWidth: 10, // 边框大小,
                                    height: 0.01,
                                    material: global.DC.Namespace.Cesium.Color.fromBytes(
                                        108,
                                        245,
                                        113,
                                        158
                                    )
                                })
                            }
                            // 如果是地图点击建筑,调用接口查详情
                            const ids =
                                e.overlay.attr['楼栋号'] == '8栋'
                                    ? '9栋'
                                    : e.overlay.attr['楼栋号'] == '9栋'
                                        ? '8栋'
                                        : e.overlay.attr['楼栋号']
                            const eIntlat = [
                                e.wgs84SurfacePosition.lng,
                                e.wgs84SurfacePosition.lat
                            ]
                            getBuildClock({
                                mechanismname: '香琴湾' + ids
                            }).then((res) => {
                                const item = res.data.data
                                // data.query.bgImg = ds.mechanismname;
                                // data.query.name = ds.tpurl;
                                // data.query.panoramaurl = ds.panoramaurl;
                                // data.query.bgImg = ds.tpurl;
                                // data.query.bgImg = ds.tpurl;
                                const useData = {
                                    name: item.mechanismname,
                                    lntLat: eIntlat,
                                    alt: item.gd,
                                    heading: item.heading,
                                    pitch: item.pitch,
                                    roll: item.roll,
                                    bgImg: item.tpurl,
                                    QRImg: item.codeurl,
                                    websiteUrl: item.websiteurl,
                                    telePhone: item.telephone,
                                    address: item.address,
                                    introduce: item.introduce,
                                    video: item.videourl,
                                    buts: ['定位', '实景', '图集'],
                                    panoramaurl: item.panoramaurl, // 全景
                                    fromTo: 'mapClick'
                                }
                                // 定制化窗体
                                // console.log(item, useData, "111111");
                                // return;
                                that.openPopupS({}, eIntlat, useData)
                            })
                        } else {
                            if (window.select.overlay != undefined) {
                                window.select.overlay.setStyle({
                                    material: window.select.color,
                                    outline: false
                                })
                                that.$store.commit('mset_changeSelect', [undefined, undefined])
                            }
                        }
                    })
                    that.$nextTick(() => {
                        document.querySelector('.dc-zoom-controller').children[0].onclick = function () {
                            const scene = global.viewer.scene
                            const camera = scene.camera
                            const focus = that._getCameraFocus(scene)
                            const cameraPosition = that._getCameraPosition(camera, focus, 1 / 2)
                            camera.flyTo({
                                destination: cameraPosition,
                                orientation: {
                                    heading: camera.heading,
                                    pitch: camera.pitch,
                                    roll: camera.roll
                                },
                                duration: 0.5,
                                convert: false,
                                complete: function () {
                                    var height = global.viewer.camera.positionCartographic.height
                                    if (that.dimension == '2.5D') {
                                        if (height < 98) {
                                            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
                                                }
                                            })
                                            return
                                        }
                                        if (height > that.fivelayerNum - that.intervallayerNum) {
                                            viewerHeight = that.fivelayerNum
                                        } else if (height <= that.fourlayerNum + that.intervallayerNum && height > that.fourlayerNum - that.intervallayerNum) {
                                            viewerHeight = that.fourlayerNum
                                        } else if (height <= that.fourlayerNum + that.intervallayerNum && height > that.threelayerNum - that.intervallayerNum) {
                                            viewerHeight = that.threelayerNum
                                        } else if (height <= that.twolayerNum + that.intervallayerNum && height > that.twolayerNum - that.intervallayerNum) {
                                            viewerHeight = that.twolayerNum
                                        } else if (height <= that.onelayerNum + that.intervallayerNum) {
                                            viewerHeight = that.onelayerNum
                                        }
                                    }
                                }
                            })
                        }
                        document.querySelector('.dc-zoom-controller').children[2].onclick = function () {
                            const scene = global.viewer.scene
                            const camera = scene.camera
                            const focus = that._getCameraFocus(scene)
                            const cameraPosition = that._getCameraPosition(camera, focus, -1)
                            camera.flyTo({
                                destination: cameraPosition,
                                orientation: {
                                    heading: camera.heading,
                                    pitch: camera.pitch,
                                    roll: camera.roll
                                },
                                duration: 0.5,
                                convert: false,
                                complete: function () {
                                    var height = global.viewer.camera.positionCartographic.height
                                    if (that.dimension == '2.5D') {
                                        if (height > 702) {
                                            global.viewer.camera.setView({
                                                destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians(
                                                    global.viewer.camera.positionCartographic.longitude,
                                                    global.viewer.camera.positionCartographic.latitude,
                                                    702
                                                ),
                                                orientation: {
                                                    // 指向
                                                    heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
                                                    // 视角
                                                    pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
                                                    roll: 0.0
                                                }
                                            })
                                            return
                                        }
                                        if (height > that.fivelayerNum - that.intervallayerNum) {
                                            viewerHeight = that.fivelayerNum
                                        } else if (height <= that.fourlayerNum + that.intervallayerNum && height > that.fourlayerNum - that.intervallayerNum) {
                                            viewerHeight = that.fourlayerNum
                                        } else if (height <= that.fourlayerNum + that.intervallayerNum && height > that.threelayerNum - that.intervallayerNum) {
                                            viewerHeight = that.threelayerNum
                                        } else if (height <= that.twolayerNum + that.intervallayerNum && height > that.twolayerNum - that.intervallayerNum) {
                                            viewerHeight = that.twolayerNum
                                        } else if (height <= that.onelayerNum + that.intervallayerNum) {
                                            viewerHeight = that.onelayerNum
                                        }
                                    }
                                }
                            })
                        }
                    })
                    that.mapMouseMove()
                    that.titlesetLayerFlag = true
                }
            }
        }
    },
@@ -195,700 +615,63 @@
                }
            })
            global.viewer.scene.globe.baseColor = global.DC.Namespace.Cesium.Color.WHITE
            if (global.DC.Namespace.Cesium.FeatureDetection.supportsImageRenderingPixelated()) { // 判断是否支持图像渲染像素化处理
                global.viewer.setOptions({
                    resolutionScale: window.devicePixelRatio
                })
            }
            that.$refs.mobileLeftNav.initialize()
            // that.$store.commit("MSET_VIEWER", viewer);
            // window.mviewer = viewer;
            // that.$store.commit("MSET_DC", DC);
            global.viewer.popup.hide()
            // const baselayer = DC.ImageryLayerFactory.createArcGisImageryLayer({
            //   url: "http://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer",
            // });
            window.baselayer = global.DC.ImageryLayerFactory.createImageryLayer(
                global.DC.ImageryType.XYZ,
                {
                    // url: 'https://webmap-tile.sf-express.com/MapTileService/rt?x={col}&y={row}&z={level}'
                    url: 'https://webmap-tile.sf-express.com/MapTileService/rt?fetchtype=static&x={x}&y={y}&z={z}&project=sfmap&pic_size=256&pic_type=png8&data_name=361100&data_format=merged-dat&data_type=normal' // 行政区划
                }
            )
            // global.viewer.addBaseLayer(baselayer, {
            //   iconUrl: "examples/images/icon/img.png",
            //   name: "影像",
            // });
            // eslint-disable-next-line camelcase
            // const baselayer_shaded = DC.ImageryLayerFactory.createArcGisImageryLayer({
            //   url: "http://services.arcgisonline.com/arcgis/rest/services/World_Shaded_Relief/MapServer",
            // });
            // global.viewer.addBaseLayer(baselayer_shaded, {
            //   iconUrl: "examples/images/icon/elec.png",
            //   name: "电子",
            // });
            // // eslint-disable-next-line camelcase
            // const baselayer_street = DC.ImageryLayerFactory.createArcGisImageryLayer({
            //   url: "http://services.arcgisonline.com/arcgis/rest/services/World_Physical_Map/MapServer",
            // });
            // global.viewer.addBaseLayer(baselayer_street, {
            //   iconUrl: "examples/images/icon/ter.png",
            //   name: "地形",
            // });
            // // eslint-disable-next-line camelcase
            // const baselayer_ter = DC.ImageryLayerFactory.createArcGisImageryLayer({
            //   url: "http://services.arcgisonline.com/arcgis/rest/services/World_Terrain_Base/MapServer",
            // });
            // global.viewer.addBaseLayer(baselayer_ter, {
            //   iconUrl: "examples/images/icon/ter.png",
            //   name: "地形",
            // });
            // 地图移动事件
            global.viewer.on(global.DC.MouseEventType.MOUSE_MOVE, (e) => {
                if (!that.iconHide) {
                    that.$store.commit('MSET_ICONHIDE', true)
                }
                // if (!that.MobileWindowsHide) {
                // that.$store.dispatch("closeMobileWindowsDom"); //关闭随地图弹窗
                // }
                // let height = Math.ceil(global.viewer.camera.positionCartographic.height);
                // console.log(height);
            })
            // global.viewer.on(global.DC.SceneEventType.CAMERA_MOVE_END, (e) => {
            global.viewer.on(global.DC.SceneEventType.CAMERA_CHANGED, (e) => {
                // 相机移动最后参数
                // 控制高度
                // return;
                const isSet = that.dimension != '3D'
                window.height1s = Math.ceil(
                    global.viewer.camera.positionCartographic.height
                )
                window.conBack = (height) => {
                    global.viewer.camera.setView({
                        destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians(
                            global.viewer.camera.positionCartographic.longitude,
                            global.viewer.camera.positionCartographic.latitude,
                            height
                        ),
                        orientation: {
                            heading: global.DC.Namespace.Cesium.Math.toRadians(
                                that.dimensionData.heading
                            ), // 方向
                            pitch: global.DC.Namespace.Cesium.Math.toRadians(
                                that.dimensionData.pitch
                            ), // 倾斜角度
                            roll: that.dimensionData.roll
                        }
                    })
                }
                // if (height < 300) {
                //   conBack(300);
                // }
                // if (height > 2000) {
                //   conBack(2000);
                // }
                // if (height <= 79 && isSet) {
                //   conBack(79);
                // }
                if (window.height1s <= that.onelayerNum - 1 && isSet) {
                    window.conBack(that.onelayerNum - 1)
                }
                // if (height > 220 && height <= 280 && isSet) {
                //   conBack(280);
                // }
                // if (height > 280 && height <= 340 && isSet) {
                //   conBack(340);
                // }
                // if (height > 340 && height <= 400 && isSet) {
                //   conBack(400);
                // }
                // if (height > 200 && isSet) {
                //   conBack(200);
                // }
                // const usMun = that.fourlayerNum ? that.fourlayerNum : that.threelayerNum;
                const usMun = that.sixlayerNum
                    ? that.sixlayerNum
                    : that.fivelayerNum
                        ? that.fivelayerNum
                        : that.fourlayerNum
                if (window.height1s > usMun && isSet) {
                    if (that.useZoom) {
                        return
                    }
                    window.conBack(usMun)
                }
            })
            // 地图点击事件
            // global.viewer.on(DC.MouseEventType.CLICK, (e) => {
            //   // console.log(e);
            //   // 定制化窗体
            //   that.openPopupS(
            //     e.position,
            //     [e.wgs84SurfacePosition.lng, e.wgs84SurfacePosition.lat],
            //     {
            //       name: "地图点击",
            //       address: [e.wgs84SurfacePosition.lng, e.wgs84SurfacePosition.lat],
            //       introduce: [e.windowPosition.x, e.windowPosition.y],
            //       from: "地图点击",
            //     }
            //   );
            // });
            // 白模型↓
            // const layer = new DC.TilesetLayer("layer");
            // global.viewer.addLayer(layer);
            // const tileset = new DC.Tileset(
            //   "http://resource.dvgis.cn/data/3dtiles/ljz/tileset.json"
            // );
            // const style = new DC.TilesetStyle();
            // style.color = {
            //   conditions: [
            //     ["${Height} >= 300", "rgba(45, 0, 75, 0.5)"],
            //     ["${Height} >= 200", "rgb(102, 71, 151)"],
            //     ["${Height} >= 100", "rgb(170, 162, 204)"],
            //     ["${Height} >= 50", "rgb(224, 226, 238)"],
            //     ["${Height} >= 25", "rgb(252, 230, 200)"],
            //     ["${Height} >= 10", "rgb(248, 176, 87)"],
            //     ["${Height} >= 5", "rgb(198, 106, 11)"],
            //     ["true", "rgb(127, 59, 8)"],
            //   ],
            // };
            // global.viewer.use(new DC.Measure());
            // tileset.setStyle(style);
            // layer.addOverlay(tileset);
            // global.viewer.flyTo(tileset);
            // 白模型↑
            // 精细模型↓
            window.tilesetLayer = new global.DC.TilesetLayer('tilesetLayer')
            global.viewer.addLayer(window.tilesetLayer)
            window.tileset = new global.DC.Tileset('/mx/tileset.json', {
                luminanceAtZenith: 0.5
            })
            // window.tilesetLayer.addOverlay(window.tileset);
            // window.tilesetLayer.show = false;
            window.silhouetteBlue =
                global.DC.Namespace.Cesium.PostProcessStageLibrary.createEdgeDetectionStage()
            window.silhouetteBlue.uniforms.color =
                global.DC.Namespace.Cesium.Color.fromBytes(9, 162, 40)
            window.silhouetteBlue.uniforms.length = 0.01
            window.silhouetteBlue.selected = []
            global.viewer.scene.postProcessStages.add(
                global.DC.Namespace.Cesium.PostProcessStageLibrary.createSilhouetteStage(
                    [window.silhouetteBlue]
                )
            )
            window.highlighted = {
                feature: undefined,
                originalColor: new global.DC.Namespace.Cesium.Color()
            }
            window.selected = {
                feature: undefined,
                originalColor: new global.DC.Namespace.Cesium.Color()
            }
            // 点击事件
            window.tileset.on(global.DC.MouseEventType.CLICK, (e) => {
                global.viewer.scene.globe.depthTestAgainstTerrain = false
                // console.log(e);
                // global.viewer.flyToPosition(
                //   new global.DC.Position(115.87186406, 28.74449337, 1800, 0, 45, 0)
                // );
                // 定制化窗体
                that.openPopupS(
                    e.position,
                    [e.wgs84Position.lng, e.wgs84Position.lat],
                    {
                        name: e.overlay.attr.name,
                        address: e.layer._id,
                        introduce: e.overlay.attr.id
                        // data: e,
                    }
                )
                // return;
                // 高亮
                window.silhouetteBlue.selected = []
                if (global.DC.Namespace.Cesium.defined(window.highlighted.feature)) {
                    window.highlighted.feature.color = window.highlighted.originalColor
                    window.highlighted.feature = undefined
                }
                if (e.feature !== window.selected.feature) {
                    window.silhouetteBlue.selected = [e.feature]
                    window.highlighted.feature = e.feature
                    global.DC.Namespace.Cesium.Color.clone(
                        e.feature.color,
                        window.highlighted.originalColor
                    )
                    e.feature.color = global.DC.Namespace.Cesium.Color.fromBytes(
                        155,
                        255,
                        175
                    )
                }
            })
            // 移动事件
            // window.tileset.on(global.DC.MouseEventType.MOUSE_MOVE, (e) => {
            //   window.silhouetteBlue.selected = [];
            //   if (global.DC.Namespace.Cesium.defined(window.highlighted.feature)) {
            //     window.highlighted.feature.color = window.highlighted.originalColor;
            //     window.highlighted.feature = undefined;
            //   }
            //   if (e.feature !== window.selected.feature) {
            //     window.silhouetteBlue.selected = [e.feature];
            //     window.highlighted.feature = e.feature;
            //     global.DC.Namespace.Cesium.Color.clone(
            //       e.feature.color,
            //       window.highlighted.originalColor
            //     );
            //     e.feature.color = global.DC.Namespace.Cesium.Color.fromBytes(
            //       155,
            //       255,
            //       175
            //     );
            //   }
            // });
            // window.tilesetLayer["changesilhouetteBlue"] = () => {
            //   window.silhouetteBlue.selected = [];
            // };
            // window.tilesetLayer.show = false;
            // 精细模型↑
            // 2.5D贴图↓
            window.usetowpointfive = () => {
                window.provider =
                    // new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
                    //   url: "http://www.tdtfz.com/OneMapServer/rest/services/fzsw2019/MapServer/WMTS/tile/1.0.0/fzsw2019/{Style}/{TileMatrixSet}/{TileMatrix}/{TileRow}/{TileCol}",
                    //   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",
                    //   ],
                    // });
                    // new global.DC.Namespace.Cesium.ArcGisMapServerImageryProvider({
                    //   url: "http://arcgis.jxpskj.com:6080/arcgis/rest/services/PingXiang25DMapDN/MapServer",
                    // });
                    new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({
                        url: '/wp/{z}/{x}/{y}.png',
                        fileExtension: 'png'
                    })
                // return global.viewer.imageryLayers.addImageryProvider(window.provider)
            }
            window.newLayer = window.usetowpointfive()
            // 2.5d贴图事件
            window.layerGroup = new global.DC.LayerGroup('modelBox')
            global.viewer.addLayerGroup(window.layerGroup)
            window.areaLayer = new global.DC.VectorLayer('areaLayer')
            window.layerGroup.addLayer(window.areaLayer)
            axios
                .get(
                    'http://arcgis.jxpskj.com:6080/arcgis/rest/services/lxxqwxq/MapServer/0/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(';')
                        window.polygon = new global.DC.Polygon(item.geometry.rings[0])
                        window.polygon.attr = item.attributes
                        window.polygon.setStyle({
                            material: global.DC.Namespace.Cesium.Color.fromBytes(
                                255,
                                255,
                                255,
                                1
                            )
                        })
                        window.areaLayer.addOverlay(window.polygon)
                    })
                    window.areaLayer.show = true
                })
            that.$store.commit('MSET_areaLayer', window.areaLayer)
            // var select = {
            //   overlay: undefined,
            //   color: undefined,
            // };
            // 地图点击事件
            global.viewer.on(global.DC.MouseEventType.CLICK, (e) => {
                // console.log(e);
                if (e.overlay != undefined && e.layer.id == 'areaLayer') {
                    if (window.select.overlay != undefined) {
                        if (e.overlay != window.select.overlay) {
                            window.select.overlay.setStyle({
                                material: window.select.color,
                                outline: false
                            })
                            that.$store.commit('mset_changeSelect', [undefined, undefined])
                        }
                    }
                    if (window.select.overlay == undefined) {
                        window.select.overlay = e.overlay
                        window.select.color = e.overlay._style.material
                        window.select.overlay.setStyle({
                            outline: true,
                            outlineColor: global.DC.Namespace.Cesium.Color.fromBytes(
                                3,
                                255,
                                13,
                                255
                            ), // 边框颜色
                            outlineWidth: 10, // 边框大小,
                            height: 0.01,
                            material: global.DC.Namespace.Cesium.Color.fromBytes(
                                108,
                                245,
                                113,
                                158
                            )
                        })
                    }
                    // 如果是地图点击建筑,调用接口查详情
                    const ids =
                        e.overlay.attr['楼栋号'] == '8栋'
                            ? '9栋'
                            : e.overlay.attr['楼栋号'] == '9栋'
                                ? '8栋'
                                : e.overlay.attr['楼栋号']
                    const eIntlat = [
                        e.wgs84SurfacePosition.lng,
                        e.wgs84SurfacePosition.lat
                    ]
                    getBuildClock({
                        mechanismname: '香琴湾' + ids
                    }).then((res) => {
                        const item = res.data.data
                        // data.query.bgImg = ds.mechanismname;
                        // data.query.name = ds.tpurl;
                        // data.query.panoramaurl = ds.panoramaurl;
                        // data.query.bgImg = ds.tpurl;
                        // data.query.bgImg = ds.tpurl;
                        const useData = {
                            name: item.mechanismname,
                            lntLat: eIntlat,
                            alt: item.gd,
                            heading: item.heading,
                            pitch: item.pitch,
                            roll: item.roll,
                            bgImg: item.tpurl,
                            QRImg: item.codeurl,
                            websiteUrl: item.websiteurl,
                            telePhone: item.telephone,
                            address: item.address,
                            introduce: item.introduce,
                            video: item.videourl,
                            buts: ['定位', '实景', '图集'],
                            panoramaurl: item.panoramaurl, // 全景
                            fromTo: 'mapClick'
                        }
                        // 定制化窗体
                        // console.log(item, useData, "111111");
                        // return;
                        that.openPopupS({}, eIntlat, useData)
                    })
                } else {
                    if (window.select.overlay != undefined) {
                        window.select.overlay.setStyle({
                            material: window.select.color,
                            outline: false
                        })
                        that.$store.commit('mset_changeSelect', [undefined, undefined])
                    }
                }
            })
            // 2.5D贴图↑
            // let startPoint;
            if (true) {
                window.startPointFn = () => {
                    window.doit2 = (int, h) => {
                        global.viewer.camera.setView({
                            // Cesium的坐标是以地心为原点,一向指向南美洲,一向指向亚洲,一向指向北极州
                            // fromDegrees()方法,将经纬度和高程转换为世界坐标
                            destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
                                // 114.0351,
                                // 27.6314,
                                // 200.0
                                int[0],
                                int[1],
                                int[2]
                            ),
                            orientation: {
                                // 指向
                                heading: global.DC.Namespace.Cesium.Math.toRadians(h[0]),
                                // 视角
                                pitch: global.DC.Namespace.Cesium.Math.toRadians(h[1]),
                                roll: h[2]
                            }
                        })
                    }
                    that.dimension == '2.5D'
                        ? window.doit2(
                            [that.mapCenter[0], that.mapCenter[1], that.frislayertHeight],
                            // [114.04062292, 27.62666834, 220.0],
                            [
                                that.dimensionData.heading,
                                that.dimensionData.pitch,
                                that.dimensionData.roll
                            ]
                        )
                        : window.doit2([114.0351, 27.6314, 300.0], [108, -26.46, 0.0])
                    // : doit([116.39038494750986, 39.902393222208644, 330.0]);
                    // doit("建模");
                }
            } else {
                // startPoint(1);
            }
            // 传递默认位置
            // that.$store.commit("MSET_MORENWEIZHI", startPoint);
            // let position = Cesium.Cartesian3.fromDegrees(108, 25, 0); //中心点位置
            // let cameraLimit = new xt3d.CameraDominate.CameraLimit(
            //   global.viewer,
            //   position,
            //   {
            //     radius: 2000,
            //     debugExtent: true,
            //   }
            // );
            // const currentViewRect = global.viewer.camera.computeViewRectangle();//东南西北数据
            // console.log(currentViewRect, 78);
            // 瀑布流↓
            window.wallLayer = new global.DC.VectorLayer('wallLayer')
            // global.viewer.addLayer(wallLayer);
            // var arr = that.wallArr;
            // arr.forEach((item) => {
            //   item = item.join(",");
            // });
            // arr = arr.join(";");
            // const wall = new global.DC.Wall(arr);
            // wall.setStyle({
            //   material: new global.DC.WallTrailMaterialProperty({
            //     color: global.DC.Namespace.Cesium.Color.fromBytes(0, 142, 255, 150),
            //     // color: global.DC.Color.DEEPSKYBLUE,
            //     speed: 4,
            //   }),
            // });
            // wallLayer.addOverlay(wall);
            // global.viewer.use(new global.DC.Measure());
            // 瀑布流↑
            // 传入store
            // that.$store.commit("MSET_MODEOLS", {
            //   tilesetLayer: window.tilesetLayer,
            //   // tileset: window.tileset,
            //   newLayer: window.newLayer,
            //   wallLayer: window.wallLayer,
            //   usetowpointfive: window.usetowpointfive,
            // });
            // 飞入起始点
            // that.$store.dispatch("mapFlyTo", {
            //   lntLat: [115.87186406, 28.74449337, 1200],
            //   heading: 0,
            //   pitch: -45,
            //   roll: 0,
            //   noOpen: true,
            // });
            // 地图渲染完成执行srore中MSET_CREADE
            // that.$store.dispatch("MSET_CREADE");
            global.viewer.compass.enable = false
            global.viewer.zoomController.enable = true
            global.viewer.locationBar.enable = false
            global.viewer.distanceLegend.enable = false
            // 判断默认维度
            // 原本默认是2.5d  改为3d默认时做出改变
            if (that.dimension == '2.5D') {
                that.$store.commit('set_frislayertHeight', that.frislayertHeight) // 送入默认弹窗高度
                that.$store.commit('set_zoomRange', [
                    that.onelayerNum,
                    // that.fourlayerNum ? that.fourlayerNum : that.threelayerNum,
                    that.sixlayerNum
                        ? that.sixlayerNum
                        : that.fivelayerNum
                            ? that.fivelayerNum
                            : that.fourlayerNum,
                    that.useZoom,
                    that.addOthers
                ]) // 送入移动端缩放范围
                that.$store.commit('MSET_DIMENSION', '2.5D') // 切换2.5D设置
                that.addBaseLayer()
            } else if (that.dimension == '3D') {
                // setTimeout((res) => {
                //   that.$store.dispatch("mapFlyTo", {
                //     lntLat: [111.25036579, 34.83767277, 11443175.85],
                //     heading: 0,
                //     pitch: -90,
                //     roll: 0,
                //     noOpen: true,
                //     fn: function () {
                // global.viewer.flyTo(window.tileset);
                // global.viewer.flyTo(provider);
                // 飞入起始点
                // that.$store.dispatch("mapFlyTo", {
                //   lntLat: [115.87186406, 28.74449337, 1200],
                //   heading: 0,
                //   pitch: -45,
                //   roll: 0,
                //   noOpen: true,
                // });
                // startPoint();
                that.$store.commit('MSET_DIMENSION', '3D') // 切换3D设置
                //     },
                //   });
                // }, 2000);
            }
            global.viewer.scene.screenSpaceCameraController._minimumZoomRate = 1000
            global.viewer.scene.screenSpaceCameraController._maximumZoomRate = 5906376272000
            // 渲染后操作
            setTimeout(() => {
                // return;
                // 判断是否有url参数
                // console.log(that.urlParameterData);
                if (typeof that.urlParameterData != 'string') {
                    // console.log(that.urlParameterData);
                    that.$store.commit('initurlParameterLayer') // 初始化自定义标签图层
                    if (that.urlParameterData.methods == 'goto') {
                        // url有定位的参数
                        // alert(that.urlParameterData.jd);
                        // alert(that.urlParameterData.wd);
                        // 创建标记
                        const dsa = {
                            list: [
                                {
                                    name: that.urlParameterData.name || '无标题',
                                    jd: that.urlParameterData.jd,
                                    wd: that.urlParameterData.wd
                                }
                            ],
                            clear: true
                        }
                        that.$store.dispatch('addurlParameterLayerIcon', dsa)
                        // that.flytos(
                        //   //飞入标记
                        //   +that.urlParameterData.jd + 0.012,
                        //   +that.urlParameterData.wd
                        // );
                        const d = {
                            position: {},
                            lntLat: [+that.urlParameterData.jd, +that.urlParameterData.wd],
                            query: {
                                introduce: '暂无内容',
                                address: '',
                                ...(that.urlParameterData || {}),
                                lntLat: [+that.urlParameterData.jd, +that.urlParameterData.wd]
                            },
                            useJWD: true // 仅使用经纬度
                        }
                        that.$store.dispatch('setMobileWindows', d)
                    } else if (that.urlParameterData.methods == 'arc') {
                        const objInit = {
                            name: that.urlParameterData.mechanismname,
                            lntLat: [that.urlParameterData.jd, that.urlParameterData.wd],
                            alt: that.urlParameterData.gd,
                            heading: that.urlParameterData.heading,
                            pitch: that.urlParameterData.pitch,
                            roll: that.urlParameterData.roll,
                            bgImg: that.urlParameterData.tpurl,
                            QRImg: that.urlParameterData.codeurl,
                            websiteUrl: that.urlParameterData.websiteurl,
                            telePhone: that.urlParameterData.telephone,
                            address: that.urlParameterData.address,
                            introduce: that.urlParameterData.introduce,
                            video: that.urlParameterData.videourl,
                            panoramaurl: that.urlParameterData.panoramaurl // 全景
                        }
                        const dataInitialization = {
                            position: {},
                            lntLat: objInit.lntLat,
                            query: { ...objInit },
                            useJWD: true // 仅使用经纬度
                            // from: 'PopupOurOnce'
                        }
                        that.$store.dispatch('setMobileWindows', dataInitialization)
                    }
                }
            }, 0)
            that.mapMouseMove()
            that.viewerExist = true
        }
        global.DC.ready(window.initViewer)
    },
    methods: {
        _getCameraFocus (scene) {
            const ray = new global.DC.Namespace.Cesium.Ray(
                scene.camera.positionWC,
                scene.camera.directionWC
            )
            const intersections = global.DC.Namespace.Cesium.IntersectionTests.rayEllipsoid(
                ray,
                global.DC.Namespace.Cesium.Ellipsoid.WGS84
            )
            if (intersections) {
                return global.DC.Namespace.Cesium.Ray.getPoint(ray, intersections.start)
            }
            // Camera direction is not pointing at the globe, so use the ellipsoid horizon point as
            // the focal point.
            return global.DC.Namespace.Cesium.IntersectionTests.grazingAltitudeLocation(
                ray,
                global.DC.Namespace.Cesium.Ellipsoid.WGS84
            )
        },
        _getCameraPosition (camera, focus, scalar) {
            const cartesian3Scratch = new global.DC.Namespace.Cesium.Cartesian3()
            const direction = global.DC.Namespace.Cesium.Cartesian3.subtract(
                focus,
                camera.position,
                cartesian3Scratch
            )
            const movementVector = global.DC.Namespace.Cesium.Cartesian3.multiplyByScalar(
                direction,
                scalar,
                cartesian3Scratch
            )
            return global.DC.Namespace.Cesium.Cartesian3.add(
                camera.position,
                movementVector,
                cartesian3Scratch
            )
        },
        getViewExtend () {
            const params = {}
            const extend = global.viewer.camera.computeViewRectangle()
@@ -984,7 +767,7 @@
        updateBaseLayer (flag) {
            const extent = this.getViewExtend()
            const array = baseLayerImgUrl.filter(item => {
            const array = baseLayers.filter(item => {
                return item[viewerHeight]
            })
@@ -1054,10 +837,7 @@
                        sm.rectangle[3] < extent.maxy
                    )
                ) {
                    var layer = global.viewer.imageryLayers.addImageryProvider(new global.DC.Namespace.Cesium.SingleTileImageryProvider({
                        url: sm.url,
                        rectangle: global.DC.Namespace.Cesium.Rectangle.fromDegrees(sm.rectangle[0], sm.rectangle[1], sm.rectangle[2], sm.rectangle[3])
                    }))
                    var layer = global.viewer.imageryLayers.addImageryProvider(sm.layer)
                    baseLayer.push({ layer, id: sm.id })
                }
@@ -1074,29 +854,106 @@
                }
                heightChange = viewerHeight
                var height = global.viewer.camera.positionCartographic.height
                if (that.dimension == '2.5D') {
                    var height = global.viewer.camera.positionCartographic.height
                    if (height > that.fivelayerNum - that.intervallayerNum) {
                        viewerHeight = that.fivelayerNum
                    } else if (height <= that.fourlayerNum + that.intervallayerNum && height > that.fourlayerNum - that.intervallayerNum) {
                        viewerHeight = that.fourlayerNum
                    } else if (height <= that.fourlayerNum + that.intervallayerNum && height > that.threelayerNum - that.intervallayerNum) {
                        viewerHeight = that.threelayerNum
                    } else if (height <= that.twolayerNum + that.intervallayerNum && height > that.twolayerNum - that.intervallayerNum) {
                        viewerHeight = that.twolayerNum
                    } else if (height <= that.onelayerNum + that.intervallayerNum) {
                        viewerHeight = that.onelayerNum
                    }
                    if (heightChange != viewerHeight) {
                        that.addBaseLayer()
                    }
                    that.updateBaseLayer(true)
                }
                that.heightChange(height)
            })
        },
        heightChange (height) {
            var that = this
            if (that.dimension == '2.5D') {
                if (height > that.fivelayerNum - that.intervallayerNum) {
                    viewerHeight = that.fivelayerNum
                } else if (height <= that.fourlayerNum + that.intervallayerNum && height > that.fourlayerNum - that.intervallayerNum) {
                    viewerHeight = that.fourlayerNum
                } else if (height <= that.threelayerNum + that.intervallayerNum && height > that.threelayerNum - that.intervallayerNum) {
                    viewerHeight = that.threelayerNum
                } else if (height <= that.twolayerNum + that.intervallayerNum && height > that.twolayerNum - that.intervallayerNum) {
                    viewerHeight = that.twolayerNum
                } else if (height <= that.onelayerNum + that.intervallayerNum) {
                    viewerHeight = that.onelayerNum
                }
                if (heightChange != viewerHeight) {
                    that.addBaseLayer()
                }
                that.updateBaseLayer(true)
            }
        },
        addMxTileset () {
            const that = this
            tilesetLayer = new global.DC.TilesetLayer('tilesetLayer')
            global.viewer.addLayer(tilesetLayer)
            tileset = new global.DC.Tileset('/mx/tileset.json', {
                luminanceAtZenith: 0.4,
                // cullWithChildrenBounds: false,
                // cullRequestsWhileMoving: false,
                // skipLevelOfDetail: false,
                shadows: global.DC.Namespace.Cesium.ShadowMode.DISABLED
            })
            tileset.setHeight(150)
            tilesetLayer.addOverlay(tileset)
            tileset.on(global.DC.MouseEventType.CLICK, that.tilesetClick)
        },
        removeMxTileset () {
            const that = this
            tileset.off(global.DC.MouseEventType.CLICK, that.tilesetClick)
            tilesetLayer.removeOverlay(tileset)
            global.viewer.removeLayer(tilesetLayer)
            tileset = null
            tilesetLayer = null
        },
        dimensionChange (type, position) {
            const that = this
            that.$store.commit('SET_DIMENSION', type)
            that.$store.commit('SET_DIMENSIONDATA', position)
            if (type == '2.5D') {
                that.removeMxTileset()
                global.viewer.camera.setView({
                    // Cesium的坐标是以地心为原点,一向指向南美洲,一向指向亚洲,一向指向北极州
                    // fromDegrees()方法,将经纬度和高程转换为世界坐标
                    destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
                        // 114.0351,
                        // 27.6314,
                        // 200.0
                        that.mapCenter[0],
                        that.mapCenter[1],
                        that.frislayertHeight
                    ),
                    orientation: {
                        // 指向
                        heading: global.DC.Namespace.Cesium.Math.toRadians(that.dimensionData.heading),
                        // 视角
                        pitch: global.DC.Namespace.Cesium.Math.toRadians(that.dimensionData.pitch),
                        roll: that.dimensionData.roll
                    }
                })
                // 2.5D视角限制
                global.viewer.scene.screenSpaceCameraController.minimumZoomDistance = that.zoomRange[0]
                // 最大
                global.viewer.scene.screenSpaceCameraController.maximumZoomDistance = that.zoomRange[1]
                // 设置相机缩小时的速率
                global.viewer.scene.screenSpaceCameraController._minimumZoomRate = 2000
                // 设置相机放大时的速率
                global.viewer.scene.screenSpaceCameraController._maximumZoomRate = 5906376272000
                // 视角平移
                global.viewer.scene.screenSpaceCameraController.enableRotate = true
                // 视角缩放
                global.viewer.scene.screenSpaceCameraController.enableZoom = true
                // 视角旋转
                global.viewer.scene.screenSpaceCameraController.enableTilt = false
            } else {
                that.addMxTileset()
            }
        }
    }
}