倾斜数据加载处理

shuishen

2024-08-21 76876910826fe7baf059e25e67d0f4e955d1fa41

倾斜数据加载处理

 src/components/map/index.vue

@@ -2,1542 +2,1879 @@
 * @Author: shuishen 1109946754@qq.com
 * @Date: 2024-06-21 16:37:19
 * @LastEditors: shuishen 1109946754@qq.com
 * @LastEditTime: 2024-07-19 15:36:09
 * @LastEditTime: 2024-08-21 21:38:56
 * @FilePath: \srs-police-affairs\src\components\map\index.vue
 * @Description: 
 * 
 * Copyright (c) 2024 by shuishen, All Rights Reserved. 
-->
<template>
    <div class="viewer-box" id="viewer-container" @click="showImgBtn = false">
        <slot ref="mainContent" name="mainContent"></slot>
  <div
    class="viewer-box"
    id="viewer-container"
    @click="showImgBtn = false"
  >
    <slot
      ref="mainContent"
      name="mainContent"
    ></slot>

        <slot name="copyrightText"></slot>
    <slot name="copyrightText"></slot>

        <slot name="showButton"></slot>
    <slot name="showButton"></slot>

        <slot name="resetPopup"></slot>
    <slot name="resetPopup"></slot>

        <div class="compass-btn">
            <el-tooltip content="指北针" placement="top" effect="dark">
                <i id="COMPASSBTN" class="el-icon-compass-btn" style="vertical-align: middle; cursor: pointer"
                    :style="{ transform: compassBtnTranslate }" @click="compassBtnClick"></i>
            </el-tooltip>
        </div>

        <div class="over-look-btn">
            <el-tooltip content="一键俯视" placement="top" effect="dark">
                <i class="fa fa-eye" style="vertical-align: middle; cursor: pointer" @click="overLookClick"></i>
            </el-tooltip>
        </div>
        <!-- 全屏控制按钮 -->
        <div class="screen-full-btn">
            <el-tooltip v-if="!isShowHomeContentBtn && isFullscreen" content="缩放" placement="top" effect="dark">
                <i class="fa fa-compress" style="vertical-align: middle; cursor: pointer" @click="fullscreenchange"></i>
            </el-tooltip>

            <el-tooltip v-if="!isShowHomeContentBtn && !isFullscreen" content="全屏" placement="top" effect="dark">
                <i class="fa fa-expand" style="vertical-align: middle; cursor: pointer" @click="fullscreenchange"></i>
            </el-tooltip>
            <el-tooltip v-if="isShowHomeContentBtn" content="显示/隐藏" placement="top" effect="dark">
                <i class="fa fa-expand" style="vertical-align: middle; cursor: pointer"
                    @click="switchShowHomeContent"></i>
            </el-tooltip>
        </div>
        <!-- 切换矢量图按钮 -->
        <div class="image-switch-icon-btn">
            <el-tooltip content="图层、模型、视角" placement="top" effect="dark">
                <div class="icon-box" @click.stop="showImgBtn = !showImgBtn">
                    <img src="/img/base_map.png" alt />
                </div>
            </el-tooltip>

            <div class="image-switch-img-btn" v-show="showImgBtn" @click.stop>
                <div class="layer-change-box">
                    <div class="title">
                        底图
                        <div class="close" @click.stop="showImgBtn = false">
                            <img src="/img/icon/close.png" alt />
                        </div>
                    </div>

                    <div class="content">
                        <div class="img" @click.stop="switchImg">
                            <span :class="{ on: imgtype == 0 }">影像</span>
                        </div>
                        <div class="elec" @click.stop="switchElec">
                            <span :class="{ on: imgtype == 1 }">矢量</span>
                        </div>
                    </div>
                </div>
                <div class="layer-change-box">
                    <div class="title">模型</div>
                    <div class="content">
                        <div class="img light" @click.stop="highOrLightChange('light')">
                            <span :class="{ on: tilesetLayerType == 'light' }">轻量</span>
                        </div>
                        <div class="elec high" @click.stop="highOrLightChange('high')">
                            <span :class="{ on: tilesetLayerType == 'high' }">高精</span>
                        </div>
                    </div>
                </div>
                <div class="angle-btn">
                    是否锁定视角：
                    <el-checkbox v-model="angleCheck" @change="angleChange"></el-checkbox>
                </div>
            </div>
        </div>

        <map-popup></map-popup>

        <architecture-popup></architecture-popup>

        <activity-police-popup></activity-police-popup>

        <multip-map-popup></multip-map-popup>

        <video-list-popup></video-list-popup>

        <map-search-popup></map-search-popup>

        <house-deep-data-popup></house-deep-data-popup>

        <business-data-popup></business-data-popup>

        <dialog-detail-popup></dialog-detail-popup>

        <hotel-popup></hotel-popup>

        <y-tool-tip></y-tool-tip>

        <assemble-box></assemble-box>

        <video-row-click-popup></video-row-click-popup>
    <div class="compass-btn">
      <el-tooltip
        content="指北针"
        placement="top"
        effect="dark"
      >
        <i
          id="COMPASSBTN"
          class="el-icon-compass-btn"
          style="vertical-align: middle; cursor: pointer"
          :style="{ transform: compassBtnTranslate }"
          @click="compassBtnClick"
        ></i>
      </el-tooltip>
    </div>

    <div class="over-look-btn">
      <el-tooltip
        content="一键俯视"
        placement="top"
        effect="dark"
      >
        <i
          class="fa fa-eye"
          style="vertical-align: middle; cursor: pointer"
          @click="overLookClick"
        ></i>
      </el-tooltip>
    </div>
    <!-- 全屏控制按钮 -->
    <div class="screen-full-btn">
      <el-tooltip
        v-if="!isShowHomeContentBtn && isFullscreen"
        content="缩放"
        placement="top"
        effect="dark"
      >
        <i
          class="fa fa-compress"
          style="vertical-align: middle; cursor: pointer"
          @click="fullscreenchange"
        ></i>
      </el-tooltip>

      <el-tooltip
        v-if="!isShowHomeContentBtn && !isFullscreen"
        content="全屏"
        placement="top"
        effect="dark"
      >
        <i
          class="fa fa-expand"
          style="vertical-align: middle; cursor: pointer"
          @click="fullscreenchange"
        ></i>
      </el-tooltip>
      <el-tooltip
        v-if="isShowHomeContentBtn"
        content="显示/隐藏"
        placement="top"
        effect="dark"
      >
        <i
          class="fa fa-expand"
          style="vertical-align: middle; cursor: pointer"
          @click="switchShowHomeContent"
        ></i>
      </el-tooltip>
    </div>
    <!-- 切换矢量图按钮 -->
    <div class="image-switch-icon-btn">
      <el-tooltip
        content="图层、模型、视角"
        placement="top"
        effect="dark"
      >
        <div
          class="icon-box"
          @click.stop="showImgBtn = !showImgBtn"
        >
          <img
            src="/img/base_map.png"
            alt
          />
        </div>
      </el-tooltip>

      <div
        class="image-switch-img-btn"
        v-show="showImgBtn"
        @click.stop
      >
        <div class="layer-change-box">
          <div class="title">
            底图
            <div
              class="close"
              @click.stop="showImgBtn = false"
            >
              <img
                src="/img/icon/close.png"
                alt
              />
            </div>
          </div>

          <div class="content">
            <div
              class="img"
              @click.stop="switchImg"
            >
              <span :class="{ on: imgtype == 0 }">影像</span>
            </div>
            <div
              class="elec"
              @click.stop="switchElec"
            >
              <span :class="{ on: imgtype == 1 }">矢量</span>
            </div>
          </div>
        </div>
        <div class="layer-change-box">
          <div class="title">模型</div>
          <div class="content">
            <div
              class="img light"
              @click.stop="highOrLightChange('light')"
            >
              <span :class="{ on: tilesetLayerType == 'light' }">轻量</span>
            </div>
            <div
              class="elec high"
              @click.stop="highOrLightChange('high')"
            >
              <span :class="{ on: tilesetLayerType == 'high' }">高精</span>
            </div>
          </div>
        </div>
        <div class="angle-btn">
          是否锁定视角：
          <el-checkbox
            v-model="angleCheck"
            @change="angleChange"
          ></el-checkbox>
        </div>
      </div>
    </div>

    <map-popup></map-popup>

    <architecture-popup></architecture-popup>

    <activity-police-popup></activity-police-popup>

    <multip-map-popup></multip-map-popup>

    <video-list-popup></video-list-popup>

    <map-search-popup></map-search-popup>

    <house-deep-data-popup></house-deep-data-popup>

    <business-data-popup></business-data-popup>

    <dialog-detail-popup></dialog-detail-popup>

    <hotel-popup></hotel-popup>

    <y-tool-tip></y-tool-tip>

    <assemble-box></assemble-box>

    <video-row-click-popup></video-row-click-popup>
  </div>
</template>

<script>
let tile3DUrl = ''
let tile3DUrl = "";

if (process.env.NODE_ENV == 'development') {
    // 开发
    tile3DUrl = window.BASE_URL_CONFIG.VUE_APP_OUTER_NET_TILEURL
if (process.env.NODE_ENV == "development") {
  // 开发
  tile3DUrl = window.BASE_URL_CONFIG.VUE_APP_OUTER_NET_TILEURL;
} else {
    // 部署
    tile3DUrl = window.BASE_URL_CONFIG.VUE_APP_INTRANET_TILEURL
  // 部署
  tile3DUrl = window.BASE_URL_CONFIG.VUE_APP_INTRANET_TILEURL;
}

let projectTerrain = null
let projectTerrain = null;

var siteEntitylayers = null
var siteEntitylayers = null;

let layersObjcect = {
    housingEstateLayer: null,
    patrolWagonLayer: null,
    handMachineLayer: null,
    monitoringLayer: null,
    panoramaLayer: null
}
let polygonObj = {}
  housingEstateLayer: null,
  patrolWagonLayer: null,
  handMachineLayer: null,
  monitoringLayer: null,
  panoramaLayer: null,
};
let polygonObj = {};

let tilesetLayer = null
let tilesetLayer = null;

let baseLayers = []
let baseLayers = [];

let tilesetObject = {
    sdTilesetLayer: null
}
  sdTilesetLayer: null,
};

let curPolygon = null
let curPolygon = null;

const ysLabels = [
    'EPSG:4490_test:0',
    'EPSG:4490_test:1',
    'EPSG:4490_test:2',
    'EPSG:4490_test:3',
    'EPSG:4490_test:4',
    'EPSG:4490_test:5',
    'EPSG:4490_test:6',
    'EPSG:4490_test:7',
    'EPSG:4490_test:8',
    'EPSG:4490_test:9',
    'EPSG:4490_test:10',
    'EPSG:4490_test:11',
    'EPSG:4490_test:12',
    'EPSG:4490_test:13',
    'EPSG:4490_test:14',
    'EPSG:4490_test:15',
    'EPSG:4490_test:16',
    'EPSG:4490_test:17',
    'EPSG:4490_test:18',
    'EPSG:4490_test:19',
    'EPSG:4490_test:20',
    'EPSG:4490_test:21',
    'EPSG:4490_test:22',
]
  "EPSG:4490_test:0",
  "EPSG:4490_test:1",
  "EPSG:4490_test:2",
  "EPSG:4490_test:3",
  "EPSG:4490_test:4",
  "EPSG:4490_test:5",
  "EPSG:4490_test:6",
  "EPSG:4490_test:7",
  "EPSG:4490_test:8",
  "EPSG:4490_test:9",
  "EPSG:4490_test:10",
  "EPSG:4490_test:11",
  "EPSG:4490_test:12",
  "EPSG:4490_test:13",
  "EPSG:4490_test:14",
  "EPSG:4490_test:15",
  "EPSG:4490_test:16",
  "EPSG:4490_test:17",
  "EPSG:4490_test:18",
  "EPSG:4490_test:19",
  "EPSG:4490_test:20",
  "EPSG:4490_test:21",
  "EPSG:4490_test:22",
];

import mapPopup from './components/mapPopup.vue'
import architecturePopup from './components/architecturePopup.vue'
import activityPolicePopup from './components/activityPolicePopup.vue'
import multipMapPopup from './components/multipMapPopup.vue'
import videoListPopup from './components/videoListPopup.vue'
import videoRowClickPopup from './components/videoRowClickPopup.vue'
import mapSearchPopup from './components/mapSearchPopup.vue'
import houseDeepDataPopup from './components/houseDeepDataPopup.vue'
import hotelPopup from './components/hotelPopup.vue'
import businessDataPopup from './components/businessDataPopup.vue'
import dialogDetailPopup from './components/dialogDetailPopup.vue'
import yToolTip from './components/yToolTip.vue'
import createTools from '@/utils/tools/index'
import { mapGetters } from 'vuex'
import { getLineSpeed } from '@/utils/turfPolygon'
import mapPopup from "./components/mapPopup.vue";
import architecturePopup from "./components/architecturePopup.vue";
import activityPolicePopup from "./components/activityPolicePopup.vue";
import multipMapPopup from "./components/multipMapPopup.vue";
import videoListPopup from "./components/videoListPopup.vue";
import videoRowClickPopup from "./components/videoRowClickPopup.vue";
import mapSearchPopup from "./components/mapSearchPopup.vue";
import houseDeepDataPopup from "./components/houseDeepDataPopup.vue";
import hotelPopup from "./components/hotelPopup.vue";
import businessDataPopup from "./components/businessDataPopup.vue";
import dialogDetailPopup from "./components/dialogDetailPopup.vue";
import yToolTip from "./components/yToolTip.vue";
import createTools from "@/utils/tools/index";
import { mapGetters } from "vuex";
import { getLineSpeed } from "@/utils/turfPolygon";

export default {
    name: 'mapBox',
  name: "mapBox",

    components: { mapPopup, architecturePopup, activityPolicePopup, multipMapPopup, videoListPopup, mapSearchPopup, houseDeepDataPopup, hotelPopup, businessDataPopup, dialogDetailPopup, yToolTip, videoRowClickPopup },
  components: {
    mapPopup,
    architecturePopup,
    activityPolicePopup,
    multipMapPopup,
    videoListPopup,
    mapSearchPopup,
    houseDeepDataPopup,
    hotelPopup,
    businessDataPopup,
    dialogDetailPopup,
    yToolTip,
    videoRowClickPopup,
  },

    data () {
        return {
            fullscreen: false,
            isFullscreen: false,
            dialogVisible: false,
            dialogTitle: "",
            searchInput: '',
            loading: false,
            searchDetailsShow: false,
            videoExist: true,
            videoTotal: 0,
            carTotal: 0,
            showImgBtn: false,
            imgtype: 0,
            tilesetLayerType: '',
            angleCheck: true,
            compassBtnTranslate: 'rotate(0deg)'
        }
    },
  data() {
    return {
      fullscreen: false,
      isFullscreen: false,
      dialogVisible: false,
      dialogTitle: "",
      searchInput: "",
      loading: false,
      searchDetailsShow: false,
      videoExist: true,
      videoTotal: 0,
      carTotal: 0,
      showImgBtn: false,
      imgtype: 0,
      tilesetLayerType: "",
      angleCheck: true,
      compassBtnTranslate: "rotate(0deg)",
    };
  },

    computed: {
        ...mapGetters([
            'isShowHomeContentBtn'
        ]),
    },
  computed: {
    ...mapGetters(["isShowHomeContentBtn"]),
  },

    mounted () {
        if (global.viewer != null) {
            global.viewer = null
        }
        const that = this

        // 初始化地图
        function initViewer () {
            // new Viewer(new 地图)
            global.viewer = new global.DC.Viewer('viewer-container', {
                contextOptions: {
                    webgl: {
                        alpha: true,
                        stencil: true,
                        preserveDrawingBuffer: true
                    }
                }
            })

            global.viewer.scene.postRender.addEventListener(function () {
                var heading = global.viewer.scene.camera.heading
                var x = -global.DC.Namespace.Cesium.Math.toDegrees(heading)
                that.compassBtnTranslate = "rotate(" + x + "deg)"
            })

            const curTools = createTools()

            Object.keys(curTools).forEach(key => {
                curTools[key].install(global.viewer)
            })

            // let curTilesetLayer = new global.DC.TilesetLayer('curTilesetLayer')
            // global.viewer.addLayer(curTilesetLayer)
            // let curTileset = new global.DC.Tileset(
            //     '/mx/tileset.json'
            // )
            // // curTileset.setHeight(20)
            // curTileset.setHeight(0)
            // curTilesetLayer.addOverlay(curTileset)

            global.viewer.setPitchRange(-90, -45)

            global.viewer.scene.globe.depthTestAgainstTerrain = false

            // 去除logo
            let primitiveArr = global.viewer.scene.primitives._primitives
            global.viewer.scene.primitives.remove(primitiveArr[0])


            // 已声明的图层添加到地图上
            siteEntitylayers = new global.DC.VectorLayer('siteEntitylayers')
            global.viewer.addLayer(siteEntitylayers)

            // 图层加入地图
            layersObjcect.housingEstateLayer = new global.DC.VectorLayer('housingEstateLayer')
            global.viewer.addLayer(layersObjcect.housingEstateLayer)
            layersObjcect.patrolWagonLayer = new global.DC.VectorLayer('patrolWagonLayer')
            global.viewer.addLayer(layersObjcect.patrolWagonLayer)
            layersObjcect.handMachineLayer = new global.DC.VectorLayer('handMachineLayer')
            global.viewer.addLayer(layersObjcect.handMachineLayer)
            layersObjcect.monitoringLayer = new global.DC.VectorLayer('monitoringLayer')
            global.viewer.addLayer(layersObjcect.monitoringLayer)
            layersObjcect.panoramaLayer = new global.DC.VectorLayer('panoramaLayer')
            global.viewer.addLayer(layersObjcect.panoramaLayer)

            // 模型图层添加
            tilesetLayer = new global.DC.TilesetLayer('tilesetLayer')
            global.viewer.addLayer(tilesetLayer)

            // 加载围栏
            // let layer = new global.DC.VectorLayer('layer')
            // global.viewer.addLayer(layer)

            // let wall = new global.DC.Wall(
            //     '116.018142,28.688089,100.0; 116.017756,28.684648,100.0; 116.019507,28.677570,100.0; 116.033653,28.675634,100.0; 116.034223,28.681389,100.0; 116.033483,28.687265,100.0; 116.018142,28.688089,100.0'
            // )

            // wall.setStyle({
            //     material: new global.DC.WallTrailMaterialProperty({
            //         color: global.DC.Namespace.Cesium.Color.fromBytes(
            //             33, 150, 243,
            //             200
            //         ),
            //         speed: 8
            //     })
            // })
            // layer.addOverlay(wall)

            // 判断是否支持图像渲染像素化处理
            if (global.DC.Namespace.Cesium.FeatureDetection.supportsImageRenderingPixelated()) {
                global.viewer.setOptions({
                    resolutionScale: window.devicePixelRatio
                })
            }

            // let terrain = global.DC.TerrainFactory.createUrlTerrain({
            //     url: 'http://data.marsgis.cn/terrain'
            // })
            // global.viewer.addTerrain(terrain)

            // 内网
            that.switchImg()

            // 地形数据添加
            // that.addTerrain()

            // 外网 
            // global.viewer.imageryLayers.addImageryProvider(
            //     new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({
            //         url: 'http://t{s}.tianditu.gov.cn/DataServer?T=vec_w&x={x}&y={y}&l={z}&tk=d083e4cf30bfc438ef93436c10c2c20a',
            //         subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'],
            //         format: 'image/jpeg',
            //         show: true,
            //         maximumLevel: 18
            //     })
            // )

            // 设置地图初始位置，角度等
            global.viewer.camera.setView({
                // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
                // fromDegrees()方法，将经纬度和高程转换为世界坐标
                destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
                    117.951478782, 28.447896798, 20000
                ),
                orientation: {
                    // 指向
                    heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
                    // 视角
                    pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
                    roll: 0.0
                }
            })

            let positions = [[117.951478782, 28.447896798, 0], [117.951469798, 28.447894686, 0], [117.951397357, 28.447698099, 0], [117.951505114, 28.447674695, 0], [117.951485465, 28.447619271, 0], [117.951706955, 28.447558541, 0], [117.951722755, 28.447611995, 0], [117.951834021, 28.447588427, 0], [117.951896863, 28.447789523, 0], [117.951478782, 28.447896798, 0]]
            let MIN_F_H = positions.map(item => {
                item[2] = 70
                return item
            })

            let MAN_F_H = positions.map(item => {
                item[2] = 80
                return item
            })

            // 原生Cesium加载多边体
            // let floorPositions = positions.reduce((prev, curr, index, arr) => {
            //     curr.forEach(item => {
            //         prev.push(item)
            //     })
            //     return prev
            // }, [])

            // flootEntitysEntites.add({
            //     polygon: {
            //         hierarchy: global.DC.Namespace.Cesium.Cartesian3.fromDegreesArrayHeights(floorPositions),
            //         heightReference: global.DC.Namespace.Cesium.HeightReference.RELATIVE_TO_GROUND,
            //         extrudedHeightReference: global.DC.Namespace.Cesium.HeightReference.RELATIVE_TO_GROUND,
            //         height: 70,
            //         extrudedHeight: 80,
            //         material: global.DC.Namespace.Cesium.Color.RED.withAlpha(0.5),
            //     }
            // })


            // console.log(floorPositions)

            // let floorPositions = MIN_F_H.concat(MAN_F_H)

            // let floorPolygonlayer = new global.DC.VectorLayer('floorPolygonlayer')
            // global.viewer.addLayer(floorPolygonlayer)

            // let floorPolygon = new global.DC.Polygon(
            //     floorPositions
            // )

            // floorPolygon.setStyle({
            //     height: 70,
            //     extrudedHeight: 80,
            //     material: global.DC.Color.GREEN.withAlpha(0.5),
            //     heightReference: 2,
            //     perPositionHeight: true
            // })

            // floorPolygonlayer.addOverlay(floorPolygon)

            // global.viewer.flyTo(floorPolygonlayer)

            // global.viewer.flyTo(sqTileset)

            global.viewer.use(new global.DC.Measure())

            // global.viewer.locationBar.enable = true
            // 缩放
            global.viewer.zoomController.enable = true
            // 比例尺
            // global.viewer.distanceLegend.enable = true

            // let arr1 = [[117.9552436, 28.44500025], [117.9557116, 28.44429919], [117.9574856, 28.44444285]]

            // arr1.forEach(item => {
            //     console.log(global.DC.CoordTransform.GCJ02ToWGS84(item[0], item[1]), 2222)
            // })
        }

        global.DC.ready(initViewer)



        // global.viewer.scene.morphTo2D(1)

        // 清除控制台
        console.clear()

        function isEleFullScreen () {
            const fullScreenEle =
                document.fullscreenElement ||
                document.msFullscreenElement ||
                document.mozFullScreenElement ||
                document.webkitFullscreenElement
            if (fullScreenEle === null) {

                that.isFullscreen = false
                return false
            } else {
                return true
            }
        }

        window.onresize = function () {
            console.log(isEleFullScreen())
        }

        // 注册事件

        // 使用示例
        // this.$EventBus.$emit('mapAddLayer', {
        //     layerName: 'housingEstateLayer',
        //     type: 'VectorLayer'
        // })


        this.$EventBus.$on('mapAddLayer', (params) => {
            that.mapAddLayer(params.layerName, params.type)
        })

        this.$EventBus.$on('mapRemoveLayer', (params) => {
            that.mapRemoveLayer(params.layerName, params.type)
        })

        this.$EventBus.$on('mapRemoveSiteLayer', (params) => {
            that.mapRemoveSiteLayer(params.layerName, params.siteId)
        })

        this.$EventBus.$on('mapRemovePolygonLayer', (params) => {
            that.mapRemovePolygonLayer(params.layerName, params.polygonName, params.type)
        })

        this.$EventBus.$on('mapRemovePolygon', (params) => {
            that.mapRemovePolygon(params.layerName, params.overlay, params.type)
        })

        this.$EventBus.$on('mapClearLayer', (params) => {
            that.mapClearLayer(params.layerName, params.type)
        })

        this.$EventBus.$on('layerPointAdd', (params) => {
            // eslint-disable-next-line no-unused-vars
            that.layerPointAdd(params.layerName, params.type, params.layerType, params.params, params.distanceDisplayCondition, params.incident, params.mouseOverIncident, params.mouseOutIncident, params.pointMouseMove)
        })

        this.$EventBus.$on('layerPolygonAdd', (params) => {
            if ('polygonName' in params) {
                that.layerPolygonAdd(params.layerName, params.positions, params.material, params.distanceDisplayCondition, params.polygonName, params.params, params.incident, params.mouseOverIncident, params.mouseOutIncident, params.setStyle)
            } else {
                that.layerPolygonAdd(params.layerName, params.positions, params.material, params.distanceDisplayCondition, 'polygon', params.params, params.incident, params.mouseOverIncident, params.mouseOutIncident, params.setStyle)
            }
        })

        this.$EventBus.$on('layerPolygonArrowsAdd', (params) => {
            that.layerPolygonArrowsAdd(params.layerName, params.positions, params.material, params.polygonName, params.params, params.incident, params.mouseOverIncident, params.mouseOutIncident, params.setStyle)
        })

        this.$EventBus.$on('layerPolylineAdd', (params) => {
            that.layerPolylineAdd(params.layerName, params.positions, params.material, params.width, params.params, params.incident)
        })

        this.$EventBus.$on('layerWallAdd', (params) => {
            that.layerWallAdd(params.layerName, params.positions)
        })

        this.$EventBus.$on('rowLayerWallAdd', (params) => {
            that.rowLayerWallAdd(params.layerName, params.positions)
        })

        this.$EventBus.$on('getOverLayerID', (params) => {
            that.getOverLayerID(params.layerName, params.ids, params.cb)
        })

        this.$EventBus.$on('layerShow', (params) => {
            that.layerShow(params.layerName, params.flag)
        })

        this.$EventBus.$on('toPosition', (params) => {
            that.toPosition(params.siteJd, params.siteWd, params.siteGd, params.siteHeading, params.sitePitch, params.siteRoll, params.time)
        })

        this.$EventBus.$on('highOrLightChange', (type, status) => {
            // eslint-disable-next-line no-unused-vars
            that.highOrLightChange(type, status)
        })

        this.$EventBus.$on('addMxTileset', (params) => {
            // eslint-disable-next-line no-unused-vars
            that.addMxTileset(params.titlesetName, params.titlesetUrl, params)
        })

        this.$EventBus.$on('closeMxTileset', () => {
            // eslint-disable-next-line no-unused-vars
            that.closeMxTileset()
        })

        this.$EventBus.$on('tilesetLayerFlag', (type, cb) => {
            // eslint-disable-next-line no-unused-vars
            that.tilesetLayerFlag(type, cb)
        })

        this.$EventBus.$on('removeMxTileset', (params) => {
            // eslint-disable-next-line no-unused-vars
            that.removeMxTileset(params.titlesetName)
        })

        this.$EventBus.$on('flytoLayer', (params) => {
            that.flytoLayer(params.polygonName, params.duration)
        })

        this.$EventBus.$on('showThreeDimensions', (params) => {
            that.showThreeDimensions(params.positions, params.minHeight, params.maxHeight)
        })

        this.$EventBus.$on('switchThreeDimensions', (params) => {
            that.switchThreeDimensions(params)
        })

        this.$EventBus.$on('clearHouse3D', () => {
            that.clearHouse3D()
        })

        this.$EventBus.$on('registerMxClick', (event) => {
            that.registerMxClick(event)
        })


        this.$EventBus.$on('unbindMxClick', (event) => {
            that.unbindMxClick(event)
        })


        // 重写定位方法
        const homeCenter = [117.99311892441567, 28.46938164123123]
        this.$nextTick(() => {
            // console.log('dc-zoom-controller', document.querySelector('.dc-zoom-controller'))
            // if (document.querySelector('.dc-zoom-controller') == null) return
            // document.querySelector('.dc-zoom-controller').children[1].onclick =
            //     function () {
            //         that.$EventBus.$emit('toPosition', {
            //             siteJd: homeCenter[0] + 0.046,
            //             siteWd: homeCenter[1] - 0.36,
            //             siteGd: 36000,
            //             siteHeading: -3,
            //             sitePitch: -45
            //         })
            //     }

            // document.querySelector('.dc-zoom-controller .refresh svg title').innerHTML = '初始化位置'
        })
    },

    methods: {
        // 获取当前地图中心的经纬度
        getSceneCenterPosition (viewer) {
            let centerResult = viewer.camera.pickEllipsoid(
                new global.DC.Namespace.Cesium.Cartesian2(
                    viewer.canvas.clientWidth / 2,
                    viewer.canvas.clientHeight / 2,
                ),
            )
            let curPosition = global.DC.Namespace.Cesium.Ellipsoid.WGS84.cartesianToCartographic(centerResult)
            let curLongitude = (curPosition.longitude * 180) / Math.PI
            let curLatitude = (curPosition.latitude * 180) / Math.PI
            return {
                lon: curLongitude,
                lat: curLatitude,
            }
        },
        compassBtnClick () {
            const degrees = global.viewer.camera.heading * (180 / Math.PI)
            if (degrees == 360) {
                return
            }
            const position = global.DC.Transform.transformCartesianToWGS84(global.viewer.camera.position)


            global.viewer.camera.flyTo({
                // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
                // fromDegrees()方法，将经纬度和高程转换为世界坐标
                destination: global.DC.Transform.transformWGS84ToCartesian(new global.DC.Position(position.lng, position.lat, position.alt + 1000)),

                orientation: {
                    // 指向
                    heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
                    // 视角
                    pitch: global.viewer.camera.pitch,
                    roll: global.viewer.camera.roll
                },
                duration: 3
            })
        },

        overLookClick () {
            const degrees = global.viewer.camera.pitch * (180 / Math.PI)

            if (degrees == -90) {
                return
            }

            const position = this.getSceneCenterPosition(global.viewer)

            global.viewer.camera.flyTo({
                // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
                // fromDegrees()方法，将经纬度和高程转换为世界坐标
                destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
                    position.lon, position.lat, global.viewer.camera.positionCartographic.height * 1.5
                ),
                orientation: {
                    // 指向
                    heading: global.viewer.camera.heading,
                    // 视角
                    pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
                    roll: global.viewer.camera.roll
                },
                duration: 3
            })
        },

        angleChange (e) {
            if (e) {
                global.viewer.camera.flyTo({
                    destination: global.viewer.camera.position,
                    orientation: {
                        heading: global.viewer.camera.heading,
                        pitch: -45,
                        roll: global.viewer.camera.roll
                    },
                    duration: 0.0
                })

                global.viewer.setPitchRange(-90, -45)
            } else {
                global.viewer.setPitchRange(-90, 0)
            }
        },

        closeMxTileset () {
            window.TILESET_LABEL.forEach(item => {
                this.removeMxTileset(`sdTilesetLayer${item}`)
            })

            this.tilesetLayerType = ''
        },

        /**
         * @description: 高精度模型和轻量模型切换
         * @param {*} type
         * @return {*}
         */
        highOrLightChange (type, status = '') {
            this.$EventBus.$emit('showHouseingTileset', {
                type: 'remove'
            })

            window.TILESET_LABEL.forEach(item => {
                this.removeMxTileset(`sdTilesetLayer${item}`)
            })

            // this.addMxTileset('sdTilesetLayer', `${tile3DUrl}/sf3d/361102/model/wanda/tileset.json`)
            // this.addMxTileset('sdTilesetLayer02', `https://tuan-gis.sit.fengtu.com.cn/361102/wanda/tileset.json`)
            // this.addMxTileset('sdTilesetLayer', `/mx/01/tileset.json`)

            if (this.tilesetLayerType == type && status == '') {
                this.tilesetLayerType = ''

            } else {
                this.tilesetLayerType = type

                type == 'light' ?
                    window.TILESET_LABEL.forEach(item => {
                        this.addMxTileset(`sdTilesetLayer${item}`, `${tile3DUrl}/sf3d/361102/model/all/${item.name}/tileset.json`, item)
                    }) :
                    window.TILESET_LABEL.forEach(item => {
                        this.addMxTileset(`sdTilesetLayer${item}`, `${tile3DUrl}/sf3d/361102/model/all1/${item.name}/tileset.json`, item)
                    })

                if (this.$route.path == "/layout/house") {
                    this.$EventBus.$emit('showHouseingTileset', {
                        type: 'add'
                    })
                }
            }
        },

        // 模型的点击事件
        tilesetClick (e) {
            if (this.$route.path != "/layout/house") {
                this.$router.push({ path: '/layout/house', query: { searchName: 'xxx小区' } })
            }
        },

        switchImg () {
            // 天地图 影像
            this.imgtype = 0
            baseLayers.length && baseLayers.forEach(item => {
                item && global.viewer.imageryLayers.remove(item)
            })

            baseLayers = []

            // const layer = global.viewer.imageryLayers.addImageryProvider(
            //     new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({
            //         url: `${window.BASE_URL_CONFIG.VUE_APP_MAP_YX}/{z}/{x}/{reverseY}.png`,
            //         minimumLevel: 0,
            //         maximumLevel: 25,
            //         tilingScheme: new global.DC.Namespace.Cesium.GeographicTilingScheme(),
            //     })
            // )

            // layer.contrast = 0.8

            // baseLayers.push(layer)

            const qp = global.viewer.imageryLayers.addImageryProvider(
                new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({
                    url: `/qp/{AZ}/{y}/{x}.png`,
                    customTags: {
                        AZ (imageryProvider, x, y, level) {
                            return 'Z' + level
                        },
                    },
                    minimumLevel: 0,
                    maximumLevel: 25,
                })
            )

            qp.contrast = 0.8

            baseLayers.push(qp)

            window.YX_LAYER_CONFIG.forEach(item => {
                let rectangle = {}

                if (item.west != 0 && item.south != 0 && item.east != 0 && item.north != 0) {
                    rectangle = { rectangle: global.DC.Namespace.Cesium.Rectangle.fromDegrees(Number(item.west), Number(item.south), Number(item.east), Number(item.north)) }
                } else {
                    return
                }

                const layer = global.viewer.imageryLayers.addImageryProvider(
                    new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({
                        url: `${window.BASE_URL_CONFIG.VUE_APP_MAP_YX}/${item.name}/{AZ}/{y}/{x}.png`,
                        customTags: {
                            AZ (imageryProvider, x, y, level) {
                                return 'Z' + level
                            },
                        },
                        minimumLevel: 0,
                        maximumLevel: 25,
                        ...rectangle
                    })
                )

                layer.contrast = 0.8

                baseLayers.push(layer)
            })

            if (window.ADD_NEW_YX_LAYER_CONFIG.length > 0) {
                window.ADD_NEW_YX_LAYER_CONFIG.forEach(item => {
                    const layer = global.viewer.imageryLayers.addImageryProvider(
                        new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({
                            url: `${window.BASE_URL_CONFIG.VUE_APP_MAP_YX}/addlayer/${item.name}/{AZ}/{y}/{x}.png`,
                            customTags: {
                                AZ (imageryProvider, x, y, level) {
                                    return 'Z' + level
                                },
                            },
                            minimumLevel: 0,
                            maximumLevel: 25,
                        })
                    )

                    layer.contrast = 0.8

                    baseLayers.push(layer)
                })
            }

            // baseLayers = global.viewer.imageryLayers.addImageryProvider(
            //     new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
            //         url: `${window.BASE_URL_CONFIG.VUE_APP_MAP_YX}/geoserver/gwc/service/wmts`,
            //         layer: "test",
            //         style: "",
            //         format: "image/png",
            //         tileMatrixSetID: "EPSG:4490_test",
            //         tileMatrixLabels: ysLabels,
            //         tilingScheme: new global.DC.Namespace.Cesium.GeographicTilingScheme(),
            //     })
            // )

        },

        switchElec () {
            // 天地图 矢量
            this.imgtype = 1

            baseLayers.length && baseLayers.forEach(item => {
                item && global.viewer.imageryLayers.remove(item)
            })

            baseLayers = []

            baseLayers.push(
                global.viewer.imageryLayers.addImageryProvider(
                    new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
                        url: `${window.BASE_URL_CONFIG.VUE_APP_MAP_SL}/MapTileService/wmts?STORETYPE=merged-dat&PROJECTION=4326`,
                        layer: "wmts_4326_361100",
                        style: "default",
                        format: "image/png",
                        tileMatrixSetID: "c",
                        tileMatrixLabels: new Array(20).fill(0).map((v, i) => i + 1),
                        tilingScheme: new global.DC.Namespace.Cesium.GeographicTilingScheme(),
                    })
                )
            )

            baseLayers.contrast = 1.0
        },

        addTerrain () {
            projectTerrain = global.DC.TerrainFactory.createUrlTerrain({
                // url: `http://data.marsgis.cn/terrain`
                url: `${window.BASE_URL_CONFIG.VUE_APP_MAP_DX}`
            })

            global.viewer.addTerrain(projectTerrain)
        },

        removeTerrain () {
            global.viewer.removeTerrain(projectTerrain)
        },

        /**
         * @description: 全屏控制
         * @return {*} 无返回值
         */
        fullscreenchange () {
            // 最新写法
            const isFullScreen = document.fullscreenElement
            if (isFullScreen) {
                if (document.exitFullscreen) {
                    document.exitFullscreen()
                } else if (document.msExitFullscreen) {
                    document.msExitFullscreen()
                } else if (document.mozCancelFullScreen) {
                    document.mozCancelFullScreen()
                } else if (document.webkitCancelFullScreen) {
                    document.webkitCancelFullScreen()
                }
                this.isFullscreen = false
            } else {
                var fullscreen = document.body   // 需要全屏的元素
                if (fullscreen.requestFullscreen) {
                    fullscreen.requestFullscreen()
                } else if (fullscreen.mozRequestFullScreen) {
                    fullscreen.mozRequestFullScreen()
                } else if (fullscreen.webkitRequestFullscreen) {
                    fullscreen.webkitRequestFullscreen()
                } else if (fullscreen.msRequestFullscreen) {
                    fullscreen.msRequestFullscreen()
                }
                this.isFullscreen = true
            }
        },

        // 切换首页显示隐藏
        switchShowHomeContent () {
            this.$store.commit('SET_ISSHOWHOMECONTENT', !this.$store.state.popupParams.isShowHomeContent)
            if (this.$store.state.popupParams.isShowHomeContent) {
                // if (document.querySelector('.dc-container .dc-zoom-controller').classList.contains('homebottom')) return
                document.querySelector('.dc-container .dc-zoom-controller').classList.add('homebottom')
                document.querySelector('.screen-full-btn').classList.add('homebottom')
                document.querySelector('.over-look-btn').classList.add('homebottom')
                document.querySelector('.compass-btn').classList.add('homebottom')
                document.querySelector('.image-switch-icon-btn').classList.add('iconbottom')
            } else {
                // if (!document.querySelector('.dc-container .dc-zoom-controller').classList.contains('homebottom')) return
                document.querySelector('.dc-container .dc-zoom-controller').classList.remove('homebottom')
                document.querySelector('.screen-full-btn').classList.remove('homebottom')
                document.querySelector('.over-look-btn').classList.remove('homebottom')
                document.querySelector('.compass-btn').classList.remove('homebottom')
                document.querySelector('.image-switch-icon-btn').classList.remove('iconbottom')
            }

        },

        /**
         * 在图层中添加实体(点)
         * @param {*} item 图标
         * @param {*} url 图标地址
         */
        addSiteEntity (item, url) {
            const billboard = new global.DC.Billboard(new global.DC.Position(Number(item.lng), Number(item.lat)), url)
            billboard.size = [20, 28]
            billboard.attrParams = item
            siteEntitylayers.addOverlay(billboard)
        },

        /**
         * 添加图层
         * @param {*} layerName 图层名称
         * @param {*} type 图层类型
         */
        mapAddLayer (layerName, type, ClusterLayerType) {
            if (!layersObjcect[layerName]) {
                this.mapRemoveLayer(layerName, type)
                layersObjcect[layerName] = null
            }

            if (type == 'VectorLayer') {
                layersObjcect[layerName] = new global.DC.VectorLayer(layerName)
            } else if (type == 'ClusterLayer') {
                layersObjcect[layerName] = new global.DC.ClusterLayer(layerName, {
                    pixelRange: 40, style: ClusterLayerType
                })
            } else if (type == 'HeatLayer') {
                layersObjcect[layerName] = new global.DC.HeatLayer(layerName, {
                    gradient: {
                        "0.5": "green",
                        "0.6": "orange",
                        "0.95": "red"
                    }, //颜色设置
                    height: 0, // 高度
                    radius: 100, // 半径
                    useGround: false, //是否使用贴地模式
                    classificationType: 2 //分类 是否影响地形，3D切片或同时影响这两者。0:地形、1:3D切片、2：两者。贴地模式下生效
                })
            }

            global.viewer.addLayer(layersObjcect[layerName])
        },

        /**
         * 删除图层
         * @param {*} layerName 图层名称
         * @param {*} type 图层类型
         */
        mapRemoveLayer (layerName, type) {
            if (type == 'VectorLayer' || type == 'ClusterLayer' || type == 'HeatLayer') {
                if (layersObjcect[layerName] && layersObjcect[layerName] != null) {
                    layersObjcect[layerName].remove()
                    layersObjcect[layerName] = null
                }
            }
        },

        /**
         * 删除图层指定面
         * @param {*} layerName 图层名称
         * @param {*} polygonName 面名称
         * @param {*} type 图层类型
         */
        mapRemovePolygonLayer (layerName, polygonName, type) {
            if (type == 'VectorLayer' || type == 'ClusterLayer' || type == 'HeatLayer') {
                if (layersObjcect[layerName] && layersObjcect[layerName] != null && polygonObj[polygonName] && polygonObj[polygonName] != null) {
                    layersObjcect[layerName].removeOverlay(polygonObj[polygonName])
                }
            }
        },

        mapRemovePolygon (layerName, overlay, type) {
            if (type == 'VectorLayer') {
                if (layersObjcect[layerName] && layersObjcect[layerName] != null) {
                    layersObjcect[layerName].removeOverlay(overlay)
                }
            }
        },

        /**
         * 清空图层
         * @param {*} layerName 图层名称
         * @param {*} type 图层类型
         */
        mapClearLayer (layerName, type) {
            if (type == 'VectorLayer' || type == 'ClusterLayer' || type == 'HeatLayer') {
                if (layersObjcect[layerName] && layersObjcect[layerName] != null)
                    layersObjcect[layerName].clear()
            }
        },

        /**
         * 图层点添加
         * @param {*} layerName 图层名称
         * @param {*} type 添加的点位类型
         * @param {*} params 添加的点位参数（内容、详情）
         * @param {*} incident 添加的点位事件
         */

        layerPointAdd (layerName, type, layerType = 'VectorLayer', params, distanceDisplayCondition = {
            near: 0, //最近距离
            far: Number.MAX_VALUE //最远距离
        }, incident = (e) => { }, mouseOverIncident = (e) => { }, mouseOutIncident = (e) => { }, pointMouseMove = (e) => { }) {
            if (!layersObjcect[layerName] || layersObjcect[layerName] == null) {
                this.mapAddLayer(layerName, layerType, params.ClusterLayerType)
            }

            let pointElement
            let labelElement

            if (type == "billboard") {
                // pointElement = new global.DC.Billboard(new global.DC.Position(Number(params.lng), Number(params.lat), Number(alt)), params.url)
                pointElement = new global.DC.Billboard(new global.DC.Position(Number(params.lng), Number(params.lat), 0), params.url)
                pointElement.setStyle(params.setStyle)
                pointElement.size = params.size || [32, 32]
                pointElement.style = "clustering"
                pointElement.attrParams = params
                layersObjcect[layerName].addOverlay(pointElement)
                pointElement.on(global.DC.MouseEventType.CLICK, incident)
                pointElement.on(global.DC.MouseEventType.MOUSE_OVER, mouseOverIncident)
                pointElement.on(global.DC.MouseEventType.MOUSE_OUT, mouseOutIncident)
                pointElement.on(global.DC.MouseEventType.MOUSE_MOVE, pointMouseMove)
            } else if (type == "label") {
                // labelElement = new global.DC.Label(new global.DC.Position(Number(params.lng), Number(params.lat), Number(alt)), params.text)
                labelElement = new global.DC.Label(new global.DC.Position(Number(params.lng), Number(params.lat), 0), params.text)
                let fontColor = 'fontColor' in params ? params.fontColor : global.DC.Color.CRIMSON
                let style = 'fontColor' in params ? global.DC.Namespace.Cesium.LabelStyle.FILL : global.DC.Namespace.Cesium.LabelStyle.FILL_AND_OUTLINE
                labelElement.setStyle({
                    style: style,
                    fillColor: fontColor,
                    outlineColor: global.DC.Color.WHITE, // 边框颜色
                    outlineWidth: params.outW || 4, // 边框大小，
                    font: '16px sans-serif',
                    pixelOffset: { x: 0, y: -30 },
                    distanceDisplayCondition: distanceDisplayCondition,
                })
                labelElement.attrParams = params
                layersObjcect[layerName].addOverlay(labelElement)
                labelElement.on(global.DC.MouseEventType.CLICK, incident)
            } else if (type == "billboardOrLabel") {
                let allSite = layersObjcect[layerName].getOverlays()

                let flag = allSite.filter(item => item.attrParams.id == params.id)

                if (flag == true) {
                    return
                }

                // pointElement = new global.DC.Billboard(new global.DC.Position(Number(params.lng), Number(params.lat), Number(alt)), params.url)
                pointElement = new global.DC.Billboard(new global.DC.Position(Number(params.lng), Number(params.lat), 0), params.url)
                pointElement.setStyle(params.setStyle)
                pointElement.size = params.size || [32, 32]
                pointElement.style = "clustering"
                pointElement.attrParams = params
                layersObjcect[layerName].addOverlay(pointElement)
                pointElement.on(global.DC.MouseEventType.CLICK, incident)
                pointElement.on(global.DC.MouseEventType.MOUSE_OVER, mouseOverIncident)
                pointElement.on(global.DC.MouseEventType.MOUSE_OUT, mouseOutIncident)
                pointElement.on(global.DC.MouseEventType.MOUSE_MOVE, pointMouseMove)

                // labelElement = new global.DC.Label(new global.DC.Position(Number(params.lng), Number(params.lat), Number(alt)), params.text)
                labelElement = new global.DC.Label(new global.DC.Position(Number(params.lng), Number(params.lat), 0), String(params.text))
                let fontColor = 'fontColor' in params ? params.fontColor : global.DC.Color.CRIMSON
                let style = 'fontColor' in params ? global.DC.Namespace.Cesium.LabelStyle.FILL : global.DC.Namespace.Cesium.LabelStyle.FILL_AND_OUTLINE
                labelElement.setStyle({
                    style: style,
                    fillColor: fontColor,
                    outlineColor: global.DC.Color.WHITE, // 边框颜色
                    outlineWidth: params.outW || 4, // 边框大小，
                    font: '16px sans-serif',
                    pixelOffset: { x: 0, y: -30 },
                    distanceDisplayCondition: distanceDisplayCondition,
                    ...params.setStyle
                })
                labelElement.attrParams = params
                layersObjcect[layerName].addOverlay(labelElement)
                labelElement.on(global.DC.MouseEventType.CLICK, incident)
            } else if (type == 'HeatPoint') {
                layersObjcect[layerName].setPositions(params.positions)
            } else if (type == "newBillboard") {
                // pointElement = new global.DC.Billboard(new global.DC.Position(Number(params.lng), Number(params.lat), Number(alt)), params.url)
                pointElement = new global.DC.Billboard(new global.DC.Position(Number(params.lng), Number(params.lat), 0), params.url)
                pointElement.setStyle(params.setStyle)
                pointElement.size = params.size || [32, 32]
                pointElement.style = "clustering"
                pointElement.attrParams = params
                layersObjcect[layerName].addOverlay(pointElement)
                pointElement.on(global.DC.MouseEventType.CLICK, incident)
                pointElement.on(global.DC.MouseEventType.MOUSE_OVER, mouseOverIncident)
                pointElement.on(global.DC.MouseEventType.MOUSE_OUT, mouseOutIncident)
                pointElement.on(global.DC.MouseEventType.MOUSE_MOVE, pointMouseMove)
            }

        },

        /**
         * 删除图层指定点
         * @param {*} layerName 图层名称
         * @param {*} siteId 点ID
         */
        mapRemoveSiteLayer (layerName, siteId) {
            if (layersObjcect[layerName]) {
                let allSite = layersObjcect[layerName].getOverlays()

                allSite.filter(item => item.attrParams.id == siteId).forEach(item => layersObjcect[layerName].removeOverlay(item))
            }
        },


        /**
         * 图层面添加
         * @param {*} layerName 图层名称
         * @param {*} positions 图层位置数据
         * @param {*} material 颜色
         * @param {*} distanceDisplayCondition 可见距离
         */
        layerPolygonAdd (layerName, positions, material, distanceDisplayCondition, polygonName, params, incident = (e) => { }, mouseOverIncident = (e) => { },
            mouseOutIncident = (e) => { }, setStyle = {}) {
            if (!layersObjcect[layerName] || layersObjcect[layerName] == null) {
                this.mapAddLayer(layerName, 'VectorLayer')

                layersObjcect[layerName].allowDrillPicking = true
            }
            // let polygon = new global.DC.Polygon(positions)
            // let polygonObj = {}//要在全局定义
            polygonObj[polygonName] = new global.DC.Polygon(positions)
            // polygon.setStyle({
            polygonObj[polygonName].setStyle({
                material: material,
                distanceDisplayCondition: distanceDisplayCondition,
                perPositionHeight: true,
                ...setStyle
            })
            // layersObjcect[layerName].addOverlay(polygon)
            polygonObj[polygonName].attrParams = params
            polygonObj[polygonName].on(global.DC.MouseEventType.CLICK, incident)
            polygonObj[polygonName].on(global.DC.MouseEventType.MOUSE_OVER, mouseOverIncident)
            polygonObj[polygonName].on(global.DC.MouseEventType.MOUSE_OUT, mouseOutIncident)
            layersObjcect[layerName].addOverlay(polygonObj[polygonName])
        },

        /**
         * 图层面添加
         * @param {*} layerName 图层名称
         * @param {*} positions 图层位置数据
         * @param {*} material 颜色
         * @param {*} distanceDisplayCondition 可见距离
         */
        layerPolygonArrowsAdd (layerName, positions, material, polygonName = '', params, incident = (e) => { }, mouseOverIncident = (e) => { },
            mouseOutIncident = (e) => { }, setStyle = {}) {
            if (!layersObjcect[layerName] || layersObjcect[layerName] == null) {
                this.mapAddLayer(layerName, 'VectorLayer')

                layersObjcect[layerName].allowDrillPicking = true
            }

            if (polygonName == '') {
                polygonName = layerName + params.id
            }

            polygonObj[polygonName] = new global.DC.Polyline(positions)


            let positionData = positions.split(';').map(item => {
                return [Number(item.split(',')[0]), Number(item.split(',')[1])]
            }).filter(item => {
                return !item.some(it => it == 0)
            })

            console.log(params.width, 15)

            polygonObj[polygonName].setStyle({
                width: params.width,
                material: new global.DC.PolylineImageTrailMaterialProperty({
                    color: new global.DC.Color(255, 255, 255),
                    speed: 20,
                    image: '/images/arrows.png',
                    repeat: {
                        x: getLineSpeed(positionData) / 2, y: 1
                    }
                }),
                distanceDisplayCondition: {
                    near: 0, //最近距离
                    far: 2000 //最远距离
                },
                clampToGround: false,
                ...setStyle
            })

            polygonObj[polygonName].attrParams = params
            layersObjcect[layerName].addOverlay(polygonObj[polygonName])
        },

        /**
         * 图层线添加
         * @param {*} layerName 图层名称
         * @param {*} positions 图层位置数据
         * @param {*} material 颜色
         * @param {*} width 宽度
         */
        layerPolylineAdd (layerName, positions, material, width, params, incident = (e) => { }) {
            if (!layersObjcect[layerName] || layersObjcect[layerName] == null) {
                this.mapAddLayer(layerName, 'VectorLayer')

                layersObjcect[layerName].allowDrillPicking = true
            }

            let polyline = new global.DC.Polyline(positions)

            polyline.setStyle({
                width: width,
                material: material,
                clampToGround: false
            })
            polyline.attrParams = params
            polyline.on(global.DC.MouseEventType.CLICK, incident)

            layersObjcect[layerName].addOverlay(polyline)
        },

        layerWallAdd (layerName, positions) {
            if (!layersObjcect[layerName] || layersObjcect[layerName] == null) {
                this.mapAddLayer(layerName, 'VectorLayer')
            }

            let wall = new global.DC.Wall(positions)
            wall.setStyle({
                material: new global.DC.WallTrailMaterialProperty({
                    color: global.DC.Namespace.Cesium.Color.fromBytes(255, 0, 0, 180),
                    speed: 10
                })
            })
            layersObjcect[layerName].addOverlay(wall)
        },

        rowLayerWallAdd (layerName, positions) {
            if (!layersObjcect[layerName] || layersObjcect[layerName] == null) {
                this.mapAddLayer(layerName, 'VectorLayer')
            }

            let wall = new global.DC.Wall(positions)
            wall.setStyle({
                material: new global.DC.WallImageTrailMaterialProperty({
                    image: '/images/jjx.png',
                    color: global.DC.Namespace.Cesium.Color.fromBytes(255, 255, 0, 180),
                    repeat: { x: 20, y: 1 },
                    speed: 10
                })
            })
            layersObjcect[layerName].addOverlay(wall)
        },

        /**
         * @description: 通过ID获取图层
         * @return {*}
         */
        getOverLayerID (layerName, ids = [], cb) {

            const data = ids.reduce((pre, cur) => {

                if (
                    layersObjcect[layerName].getOverlay(cur.overlayId)
                    && layersObjcect[layerName].getOverlay(cur.overlayId) != undefined
                    && layersObjcect[layerName].getOverlay(cur.overlayId) != null
                    && layersObjcect[layerName].getOverlay(cur.overlayId) != ''
                ) {
                    pre.push(layersObjcect[layerName].getOverlay(cur.overlayId).attrParams)
                } else {
                    layersObjcect[layerName].eachOverlay(item => {
                        if (item.overlayId == cur.overlayId)
                            pre.push(item.attrParams)
                    })
                }

                return pre

            }, [])

            cb(data)

        },

        /**
         * 图层显示隐藏
         * @param {*} layerName 图层名称
         * @param {*} flag 显示隐藏
         */
        layerShow (layerName, flag) {
            if (layersObjcect[layerName]) layersObjcect[layerName].show = flag
        },

        /**
         * 飞到指定位置
         * @param {*} siteJd 经度
         * @param {*} siteWd 纬度
         * @param {*} siteGd 高度，默认0
         * @param {*} siteHeading 偏航角度，默认0
         * @param {*} sitePitch 俯仰角度，默认0
         * @param {*} siteRoll 翻转角度，默认0
         * @param {*} time 飞行时间，默认3秒
         */
        toPosition (siteJd, siteWd, siteGd = 2000, siteHeading = 0, sitePitch = -90, siteRoll = 0, time = 3) {
            global.viewer.flyToPosition(
                new global.DC.Position(
                    Number(siteJd),
                    Number(siteWd),
                    Number(siteGd),
                    Number(siteHeading),
                    Number(sitePitch),
                    Number(siteRoll)
                ),
                function () { },
                time
            )
        },
        // sdTilesetLayer

        /**
        * 飞到指定范围
        * @param {*} polygonName 范围名称
        * @param {*} duration 时间
        */
        flytoLayer (polygonName, duration = 3) {
            global.viewer.flyTo(polygonObj[polygonName], duration)
        },

        /**
         * 添加模型
         * @param {*} titlesetName 图层名称
         * @param {*} titlesetUrl 模型地址
         * @param {*} incident 模型点击事件
         */
        addMxTileset (titlesetName, titlesetUrl, conf) {
            if (!tilesetObject[titlesetName]) tilesetObject[titlesetName] = null

            tilesetObject[titlesetName] = new global.DC.Tileset(titlesetUrl, {
                luminanceAtZenith: 0.4,
                // cullWithChildrenBounds: false,
                // cullRequestsWhileMoving: false,
                // skipLevelOfDetail: false,
                maximumScreenSpaceError: conf.maximumScreenSpaceError || 16,
                shadows: global.DC.Namespace.Cesium.ShadowMode.DISABLED
            })

            // 地形数据添加
            tilesetObject[titlesetName].setHeight(-73)

            tilesetLayer.addOverlay(tilesetObject[titlesetName])

            // global.viewer.flyTo(tilesetObject[titlesetName])removeMxTileset
        },

        tilesetLayerFlag (type, cb) {
            if (type == 1) {
                if (this.tilesetLayerType != '') {
                    this.$message({
                        message: '请关闭模型再开始绘制',
                        type: 'warning'
                    })

                    cb(false)
                    return
                }
            } else {
                if (this.tilesetLayerType == '') {
                    this.$message({
                        message: '请打开模型再开始绘制',
                        type: 'warning'
                    })

                    cb(false)
                    return
                }
            }

            cb(true)
        },

        /**
         * 删除模型
         * @param {*} titlesetName 图层名称
         * @param {*} incident 模型点击事件
         */
        removeMxTileset (titlesetName) {
            if (tilesetObject[titlesetName] && tilesetObject[titlesetName] != null) {
                tilesetLayer.removeOverlay(tilesetObject[titlesetName])
                tilesetObject[titlesetName] = null
            }
        },

        /**
        * 建筑高亮显示
        * @param {*} positions 建筑范围坐标
        * @param {*} 
        */
        showThreeDimensions (positions, minHeight, maxHeight) {
            console.log('showThreeDimensions--map')
            if (curPolygon != null) {
                global.viewer.scene.primitives.remove(curPolygon)
                curPolygon = null
            }

            let housePositions = JSON.parse(positions).coordinates[0]

            let floorPositions = housePositions.reduce((prev, curr) => {
                prev.push(curr[0])
                prev.push(curr[1])

                return prev
            }, [])

            curPolygon = new global.DC.Namespace.Cesium.ClassificationPrimitive({
                geometryInstances: new global.DC.Namespace.Cesium.GeometryInstance({
                    geometry: new global.DC.Namespace.Cesium.PolygonGeometry({
                        polygonHierarchy: new global.DC.Namespace.Cesium.PolygonHierarchy(
                            global.DC.Namespace.Cesium.Cartesian3.fromDegreesArray(floorPositions),
                        ),
                        extrudedHeight: maxHeight - 73,//分层顶部海拔
                        height: minHeight - 73,//分层底部海拔
                    }),

                    attributes: {
                        color: global.DC.Namespace.Cesium.ColorGeometryInstanceAttribute.fromColor(global.DC.Namespace.Cesium.Color.RED.withAlpha(0.5)),
                        show: new global.DC.Namespace.Cesium.ShowGeometryInstanceAttribute(true)
                    },
                }),

                classificationType: global.DC.Namespace.Cesium.ClassificationType.CESIUM_3D_TILE
            })

            global.viewer.scene.primitives.add(curPolygon)
        },

        // 建筑高亮切换显示隐藏
        switchThreeDimensions (boolean) {
            if (!curPolygon) return
            curPolygon.show = boolean
        },

        // 清除建筑3D
        clearHouse3D () {
            global.viewer.scene.primitives.remove(curPolygon)

            curPolygon = null
        },

        registerMxClick (event) {
            this.unbindMxClick()
            window.TILESET_LABEL.forEach(item => {
                if (tilesetObject[`sdTilesetLayer${item}`] && tilesetObject[`sdTilesetLayer${item}`] != null) {
                    tilesetObject[`sdTilesetLayer${item}`].on(global.DC.MouseEventType.CLICK, event)
                }
            })
        },

        unbindMxClick (event) {
            window.TILESET_LABEL.forEach(item => {
                if (tilesetObject[`sdTilesetLayer${item}`] && tilesetObject[`sdTilesetLayer${item}`] != null) {
                    tilesetObject[`sdTilesetLayer${item}`].off(global.DC.MouseEventType.CLICK, event)
                }
            })
        }
    },

    destroyed () {
        this.$EventBus.$off('mapAddLayer')
        this.$EventBus.$off('mapRemoveLayer')
        this.$EventBus.$off('mapRemovePolygonLayer')
        this.$EventBus.$off('mapRemoveSiteLayer')
        this.$EventBus.$off('mapRemovePolygon')
        this.$EventBus.$off('mapClearLayer')
        this.$EventBus.$off('layerPointAdd')
        this.$EventBus.$off('layerPolygonAdd')
        this.$EventBus.$off('layerPolygonArrowsAdd')
        this.$EventBus.$off('layerPolylineAdd')
        this.$EventBus.$off('layerWallAdd')
        this.$EventBus.$off('rowLayerWallAdd')
        this.$EventBus.$off('getOverLayerID')
        this.$EventBus.$off('layerShow')
        this.$EventBus.$off('toPosition')
        this.$EventBus.$off('highOrLightChange')
        this.$EventBus.$off('addMxTileset')
        this.$EventBus.$off('closeMxTileset')
        this.$EventBus.$off('tilesetLayerFlag')
        this.$EventBus.$off('removeMxTileset')
        this.$EventBus.$off('flytoLayer')
        this.$EventBus.$off('showThreeDimensions')
        this.$EventBus.$off('switchThreeDimensions')
        this.$EventBus.$off('clearHouse3D')
        this.$EventBus.$off('registerMxClick')
        this.$EventBus.$off('unbindMxClick')
  mounted() {
    if (global.viewer != null) {
      global.viewer = null;
    }
}
    const that = this;

    // 初始化地图
    function initViewer() {
      // new Viewer(new 地图)
      global.viewer = new global.DC.Viewer("viewer-container", {
        contextOptions: {
          webgl: {
            alpha: true,
            stencil: true,
            preserveDrawingBuffer: true,
          },
        },
      });

      global.viewer.scene.postRender.addEventListener(function () {
        var heading = global.viewer.scene.camera.heading;
        var x = -global.DC.Namespace.Cesium.Math.toDegrees(heading);
        that.compassBtnTranslate = "rotate(" + x + "deg)";
      });

      const curTools = createTools();

      Object.keys(curTools).forEach((key) => {
        curTools[key].install(global.viewer);
      });

      // let curTilesetLayer = new global.DC.TilesetLayer('curTilesetLayer')
      // global.viewer.addLayer(curTilesetLayer)
      // let curTileset = new global.DC.Tileset(
      //     '/mx/tileset.json'
      // )
      // // curTileset.setHeight(20)
      // curTileset.setHeight(0)
      // curTilesetLayer.addOverlay(curTileset)

      global.viewer.setPitchRange(-90, -45);

      global.viewer.scene.globe.depthTestAgainstTerrain = false;

      // 去除logo
      let primitiveArr = global.viewer.scene.primitives._primitives;
      global.viewer.scene.primitives.remove(primitiveArr[0]);

      // 已声明的图层添加到地图上
      siteEntitylayers = new global.DC.VectorLayer("siteEntitylayers");
      global.viewer.addLayer(siteEntitylayers);

      // 图层加入地图
      layersObjcect.housingEstateLayer = new global.DC.VectorLayer(
        "housingEstateLayer"
      );
      global.viewer.addLayer(layersObjcect.housingEstateLayer);
      layersObjcect.patrolWagonLayer = new global.DC.VectorLayer(
        "patrolWagonLayer"
      );
      global.viewer.addLayer(layersObjcect.patrolWagonLayer);
      layersObjcect.handMachineLayer = new global.DC.VectorLayer(
        "handMachineLayer"
      );
      global.viewer.addLayer(layersObjcect.handMachineLayer);
      layersObjcect.monitoringLayer = new global.DC.VectorLayer(
        "monitoringLayer"
      );
      global.viewer.addLayer(layersObjcect.monitoringLayer);
      layersObjcect.panoramaLayer = new global.DC.VectorLayer("panoramaLayer");
      global.viewer.addLayer(layersObjcect.panoramaLayer);

      // 模型图层添加
      tilesetLayer = new global.DC.TilesetLayer("tilesetLayer");
      global.viewer.addLayer(tilesetLayer);

      // 加载围栏
      // let layer = new global.DC.VectorLayer('layer')
      // global.viewer.addLayer(layer)

      // let wall = new global.DC.Wall(
      //     '116.018142,28.688089,100.0; 116.017756,28.684648,100.0; 116.019507,28.677570,100.0; 116.033653,28.675634,100.0; 116.034223,28.681389,100.0; 116.033483,28.687265,100.0; 116.018142,28.688089,100.0'
      // )

      // wall.setStyle({
      //     material: new global.DC.WallTrailMaterialProperty({
      //         color: global.DC.Namespace.Cesium.Color.fromBytes(
      //             33, 150, 243,
      //             200
      //         ),
      //         speed: 8
      //     })
      // })
      // layer.addOverlay(wall)

      // 判断是否支持图像渲染像素化处理
      if (
        global.DC.Namespace.Cesium.FeatureDetection.supportsImageRenderingPixelated()
      ) {
        global.viewer.setOptions({
          resolutionScale: window.devicePixelRatio,
        });
      }

      // let terrain = global.DC.TerrainFactory.createUrlTerrain({
      //     url: 'http://data.marsgis.cn/terrain'
      // })
      // global.viewer.addTerrain(terrain)

      // 内网
      that.switchImg();

      // 地形数据添加
      // that.addTerrain()

      // 外网
      // global.viewer.imageryLayers.addImageryProvider(
      //     new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({
      //         url: 'http://t{s}.tianditu.gov.cn/DataServer?T=vec_w&x={x}&y={y}&l={z}&tk=d083e4cf30bfc438ef93436c10c2c20a',
      //         subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'],
      //         format: 'image/jpeg',
      //         show: true,
      //         maximumLevel: 18
      //     })
      // )

      // 设置地图初始位置，角度等
      global.viewer.camera.setView({
        // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
        // fromDegrees()方法，将经纬度和高程转换为世界坐标
        destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
          117.951478782,
          28.447896798,
          20000
        ),
        orientation: {
          // 指向
          heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
          // 视角
          pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
          roll: 0.0,
        },
      });

      let positions = [
        [117.951478782, 28.447896798, 0],
        [117.951469798, 28.447894686, 0],
        [117.951397357, 28.447698099, 0],
        [117.951505114, 28.447674695, 0],
        [117.951485465, 28.447619271, 0],
        [117.951706955, 28.447558541, 0],
        [117.951722755, 28.447611995, 0],
        [117.951834021, 28.447588427, 0],
        [117.951896863, 28.447789523, 0],
        [117.951478782, 28.447896798, 0],
      ];
      let MIN_F_H = positions.map((item) => {
        item[2] = 70;
        return item;
      });

      let MAN_F_H = positions.map((item) => {
        item[2] = 80;
        return item;
      });

      // 原生Cesium加载多边体
      // let floorPositions = positions.reduce((prev, curr, index, arr) => {
      //     curr.forEach(item => {
      //         prev.push(item)
      //     })
      //     return prev
      // }, [])

      // flootEntitysEntites.add({
      //     polygon: {
      //         hierarchy: global.DC.Namespace.Cesium.Cartesian3.fromDegreesArrayHeights(floorPositions),
      //         heightReference: global.DC.Namespace.Cesium.HeightReference.RELATIVE_TO_GROUND,
      //         extrudedHeightReference: global.DC.Namespace.Cesium.HeightReference.RELATIVE_TO_GROUND,
      //         height: 70,
      //         extrudedHeight: 80,
      //         material: global.DC.Namespace.Cesium.Color.RED.withAlpha(0.5),
      //     }
      // })

      // console.log(floorPositions)

      // let floorPositions = MIN_F_H.concat(MAN_F_H)

      // let floorPolygonlayer = new global.DC.VectorLayer('floorPolygonlayer')
      // global.viewer.addLayer(floorPolygonlayer)

      // let floorPolygon = new global.DC.Polygon(
      //     floorPositions
      // )

      // floorPolygon.setStyle({
      //     height: 70,
      //     extrudedHeight: 80,
      //     material: global.DC.Color.GREEN.withAlpha(0.5),
      //     heightReference: 2,
      //     perPositionHeight: true
      // })

      // floorPolygonlayer.addOverlay(floorPolygon)

      // global.viewer.flyTo(floorPolygonlayer)

      // global.viewer.flyTo(sqTileset)

      global.viewer.use(new global.DC.Measure());

      // global.viewer.locationBar.enable = true
      // 缩放
      global.viewer.zoomController.enable = true;
      // 比例尺
      // global.viewer.distanceLegend.enable = true

      // let arr1 = [[117.9552436, 28.44500025], [117.9557116, 28.44429919], [117.9574856, 28.44444285]]

      // arr1.forEach(item => {
      //     console.log(global.DC.CoordTransform.GCJ02ToWGS84(item[0], item[1]), 2222)
      // })
    }

    global.DC.ready(initViewer);

    // global.viewer.scene.morphTo2D(1)

    // 清除控制台
    console.clear();

    function isEleFullScreen() {
      const fullScreenEle =
        document.fullscreenElement ||
        document.msFullscreenElement ||
        document.mozFullScreenElement ||
        document.webkitFullscreenElement;
      if (fullScreenEle === null) {
        that.isFullscreen = false;
        return false;
      } else {
        return true;
      }
    }

    window.onresize = function () {
      console.log(isEleFullScreen());
    };

    // 注册事件

    // 使用示例
    // this.$EventBus.$emit('mapAddLayer', {
    //     layerName: 'housingEstateLayer',
    //     type: 'VectorLayer'
    // })

    this.$EventBus.$on("mapAddLayer", (params) => {
      that.mapAddLayer(params.layerName, params.type);
    });

    this.$EventBus.$on("mapRemoveLayer", (params) => {
      that.mapRemoveLayer(params.layerName, params.type);
    });

    this.$EventBus.$on("mapRemoveSiteLayer", (params) => {
      that.mapRemoveSiteLayer(params.layerName, params.siteId);
    });

    this.$EventBus.$on("mapRemovePolygonLayer", (params) => {
      that.mapRemovePolygonLayer(
        params.layerName,
        params.polygonName,
        params.type
      );
    });

    this.$EventBus.$on("mapRemovePolygon", (params) => {
      that.mapRemovePolygon(params.layerName, params.overlay, params.type);
    });

    this.$EventBus.$on("mapClearLayer", (params) => {
      that.mapClearLayer(params.layerName, params.type);
    });

    this.$EventBus.$on("layerPointAdd", (params) => {
      // eslint-disable-next-line no-unused-vars
      that.layerPointAdd(
        params.layerName,
        params.type,
        params.layerType,
        params.params,
        params.distanceDisplayCondition,
        params.incident,
        params.mouseOverIncident,
        params.mouseOutIncident,
        params.pointMouseMove
      );
    });

    this.$EventBus.$on("layerPolygonAdd", (params) => {
      if ("polygonName" in params) {
        that.layerPolygonAdd(
          params.layerName,
          params.positions,
          params.material,
          params.distanceDisplayCondition,
          params.polygonName,
          params.params,
          params.incident,
          params.mouseOverIncident,
          params.mouseOutIncident,
          params.setStyle
        );
      } else {
        that.layerPolygonAdd(
          params.layerName,
          params.positions,
          params.material,
          params.distanceDisplayCondition,
          "polygon",
          params.params,
          params.incident,
          params.mouseOverIncident,
          params.mouseOutIncident,
          params.setStyle
        );
      }
    });

    this.$EventBus.$on("layerPolygonArrowsAdd", (params) => {
      that.layerPolygonArrowsAdd(
        params.layerName,
        params.positions,
        params.material,
        params.polygonName,
        params.params,
        params.incident,
        params.mouseOverIncident,
        params.mouseOutIncident,
        params.setStyle
      );
    });

    this.$EventBus.$on("layerPolylineAdd", (params) => {
      that.layerPolylineAdd(
        params.layerName,
        params.positions,
        params.material,
        params.width,
        params.params,
        params.incident
      );
    });

    this.$EventBus.$on("layerWallAdd", (params) => {
      that.layerWallAdd(params.layerName, params.positions);
    });

    this.$EventBus.$on("rowLayerWallAdd", (params) => {
      that.rowLayerWallAdd(params.layerName, params.positions);
    });

    this.$EventBus.$on("getOverLayerID", (params) => {
      that.getOverLayerID(params.layerName, params.ids, params.cb);
    });

    this.$EventBus.$on("layerShow", (params) => {
      that.layerShow(params.layerName, params.flag);
    });

    this.$EventBus.$on("toPosition", (params) => {
      that.toPosition(
        params.siteJd,
        params.siteWd,
        params.siteGd,
        params.siteHeading,
        params.sitePitch,
        params.siteRoll,
        params.time
      );
    });

    this.$EventBus.$on("highOrLightChange", (type, status) => {
      // eslint-disable-next-line no-unused-vars
      that.highOrLightChange(type, status);
    });

    this.$EventBus.$on("addMxTileset", (params) => {
      // eslint-disable-next-line no-unused-vars
      that.addMxTileset(params.titlesetName, params.titlesetUrl, params);
    });

    this.$EventBus.$on("closeMxTileset", () => {
      // eslint-disable-next-line no-unused-vars
      that.closeMxTileset();
    });

    this.$EventBus.$on("tilesetLayerFlag", (type, cb) => {
      // eslint-disable-next-line no-unused-vars
      that.tilesetLayerFlag(type, cb);
    });

    this.$EventBus.$on("removeMxTileset", (params) => {
      // eslint-disable-next-line no-unused-vars
      that.removeMxTileset(params.titlesetName);
    });

    this.$EventBus.$on("flytoLayer", (params) => {
      that.flytoLayer(params.polygonName, params.duration);
    });

    this.$EventBus.$on("showThreeDimensions", (params) => {
      that.showThreeDimensions(
        params.positions,
        params.minHeight,
        params.maxHeight
      );
    });

    this.$EventBus.$on("switchThreeDimensions", (params) => {
      that.switchThreeDimensions(params);
    });

    this.$EventBus.$on("clearHouse3D", () => {
      that.clearHouse3D();
    });

    this.$EventBus.$on("registerMxClick", (event) => {
      that.registerMxClick(event);
    });

    this.$EventBus.$on("unbindMxClick", (event) => {
      that.unbindMxClick(event);
    });

    // 重写定位方法
    const homeCenter = [117.99311892441567, 28.46938164123123];
    this.$nextTick(() => {
      // console.log('dc-zoom-controller', document.querySelector('.dc-zoom-controller'))
      // if (document.querySelector('.dc-zoom-controller') == null) return
      // document.querySelector('.dc-zoom-controller').children[1].onclick =
      //     function () {
      //         that.$EventBus.$emit('toPosition', {
      //             siteJd: homeCenter[0] + 0.046,
      //             siteWd: homeCenter[1] - 0.36,
      //             siteGd: 36000,
      //             siteHeading: -3,
      //             sitePitch: -45
      //         })
      //     }
      // document.querySelector('.dc-zoom-controller .refresh svg title').innerHTML = '初始化位置'
    });
  },

  methods: {
    // 获取当前地图中心的经纬度
    getSceneCenterPosition(viewer) {
      let centerResult = viewer.camera.pickEllipsoid(
        new global.DC.Namespace.Cesium.Cartesian2(
          viewer.canvas.clientWidth / 2,
          viewer.canvas.clientHeight / 2
        )
      );
      let curPosition =
        global.DC.Namespace.Cesium.Ellipsoid.WGS84.cartesianToCartographic(
          centerResult
        );
      let curLongitude = (curPosition.longitude * 180) / Math.PI;
      let curLatitude = (curPosition.latitude * 180) / Math.PI;
      return {
        lon: curLongitude,
        lat: curLatitude,
      };
    },
    compassBtnClick() {
      const degrees = global.viewer.camera.heading * (180 / Math.PI);
      if (degrees == 360) {
        return;
      }
      const position = global.DC.Transform.transformCartesianToWGS84(
        global.viewer.camera.position
      );

      global.viewer.camera.flyTo({
        // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
        // fromDegrees()方法，将经纬度和高程转换为世界坐标
        destination: global.DC.Transform.transformWGS84ToCartesian(
          new global.DC.Position(
            position.lng,
            position.lat,
            position.alt + 1000
          )
        ),

        orientation: {
          // 指向
          heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
          // 视角
          pitch: global.viewer.camera.pitch,
          roll: global.viewer.camera.roll,
        },
        duration: 3,
      });
    },

    overLookClick() {
      const degrees = global.viewer.camera.pitch * (180 / Math.PI);

      if (degrees == -90) {
        return;
      }

      const position = this.getSceneCenterPosition(global.viewer);

      global.viewer.camera.flyTo({
        // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
        // fromDegrees()方法，将经纬度和高程转换为世界坐标
        destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
          position.lon,
          position.lat,
          global.viewer.camera.positionCartographic.height * 1.5
        ),
        orientation: {
          // 指向
          heading: global.viewer.camera.heading,
          // 视角
          pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
          roll: global.viewer.camera.roll,
        },
        duration: 3,
      });
    },

    angleChange(e) {
      if (e) {
        global.viewer.camera.flyTo({
          destination: global.viewer.camera.position,
          orientation: {
            heading: global.viewer.camera.heading,
            pitch: -45,
            roll: global.viewer.camera.roll,
          },
          duration: 0.0,
        });

        global.viewer.setPitchRange(-90, -45);
      } else {
        global.viewer.setPitchRange(-90, 0);
      }
    },

    closeMxTileset() {
      window.TILESET_LABEL.forEach((item) => {
        this.removeMxTileset(`sdTilesetLayer${item.name}`);
      });

      this.tilesetLayerType = "";
    },

    /**
     * @description: 高精度模型和轻量模型切换
     * @param {*} type
     * @return {*}
     */
    highOrLightChange(type, status = "") {
      this.$EventBus.$emit("showHouseingTileset", {
        type: "remove",
      });

      window.TILESET_LABEL.forEach((item) => {
        this.removeMxTileset(`sdTilesetLayer${item.name}`);
      });

      // this.addMxTileset('sdTilesetLayer', `${tile3DUrl}/sf3d/361102/model/wanda/tileset.json`)
      // this.addMxTileset('sdTilesetLayer02', `https://tuan-gis.sit.fengtu.com.cn/361102/wanda/tileset.json`)
      // this.addMxTileset('sdTilesetLayer', `/mx/01/tileset.json`)

      if (this.tilesetLayerType == type && status == "") {
        this.tilesetLayerType = "";
      } else {
        this.tilesetLayerType = type;

        type == "light"
          ? window.TILESET_LABEL.forEach((item) => {
              this.addMxTileset(
                `sdTilesetLayer${item.name}`,
                `${tile3DUrl}/sf3d/361102/model/all/${item.name}/tileset.json`,
                item
              );
            })
          : window.TILESET_LABEL.forEach((item) => {
              this.addMxTileset(
                `sdTilesetLayer${item.name}`,
                `${tile3DUrl}/sf3d/361102/model/all1/${item.name}/tileset.json`,
                item
              );
            });

        if (this.$route.path == "/layout/house") {
          this.$EventBus.$emit("showHouseingTileset", {
            type: "add",
          });
        }
      }
    },

    // 模型的点击事件
    tilesetClick(e) {
      if (this.$route.path != "/layout/house") {
        this.$router.push({
          path: "/layout/house",
          query: { searchName: "xxx小区" },
        });
      }
    },

    switchImg() {
      // 天地图 影像
      this.imgtype = 0;
      baseLayers.length &&
        baseLayers.forEach((item) => {
          item && global.viewer.imageryLayers.remove(item);
        });

      baseLayers = [];

      // const layer = global.viewer.imageryLayers.addImageryProvider(
      //     new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({
      //         url: `${window.BASE_URL_CONFIG.VUE_APP_MAP_YX}/{z}/{x}/{reverseY}.png`,
      //         minimumLevel: 0,
      //         maximumLevel: 25,
      //         tilingScheme: new global.DC.Namespace.Cesium.GeographicTilingScheme(),
      //     })
      // )

      // layer.contrast = 0.8

      // baseLayers.push(layer)

      const qp = global.viewer.imageryLayers.addImageryProvider(
        new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({
          url: `/qp/{AZ}/{y}/{x}.png`,
          customTags: {
            AZ(imageryProvider, x, y, level) {
              return "Z" + level;
            },
          },
          minimumLevel: 0,
          maximumLevel: 25,
        })
      );

      qp.contrast = 0.8;

      baseLayers.push(qp);

      window.YX_LAYER_CONFIG.forEach((item) => {
        let rectangle = {};

        if (
          item.west != 0 &&
          item.south != 0 &&
          item.east != 0 &&
          item.north != 0
        ) {
          rectangle = {
            rectangle: global.DC.Namespace.Cesium.Rectangle.fromDegrees(
              Number(item.west),
              Number(item.south),
              Number(item.east),
              Number(item.north)
            ),
          };
        } else {
          return;
        }

        const layer = global.viewer.imageryLayers.addImageryProvider(
          new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({
            url: `${window.BASE_URL_CONFIG.VUE_APP_MAP_YX}/${item.name}/{AZ}/{y}/{x}.png`,
            customTags: {
              AZ(imageryProvider, x, y, level) {
                return "Z" + level;
              },
            },
            minimumLevel: 0,
            maximumLevel: 25,
            ...rectangle,
          })
        );

        layer.contrast = 0.8;

        baseLayers.push(layer);
      });

      if (window.ADD_NEW_YX_LAYER_CONFIG.length > 0) {
        window.ADD_NEW_YX_LAYER_CONFIG.forEach((item) => {
          const layer = global.viewer.imageryLayers.addImageryProvider(
            new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({
              url: `${window.BASE_URL_CONFIG.VUE_APP_MAP_YX}/addlayer/${item.name}/{AZ}/{y}/{x}.png`,
              customTags: {
                AZ(imageryProvider, x, y, level) {
                  return "Z" + level;
                },
              },
              minimumLevel: 0,
              maximumLevel: 25,
            })
          );

          layer.contrast = 0.8;

          baseLayers.push(layer);
        });
      }

      // baseLayers = global.viewer.imageryLayers.addImageryProvider(
      //     new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
      //         url: `${window.BASE_URL_CONFIG.VUE_APP_MAP_YX}/geoserver/gwc/service/wmts`,
      //         layer: "test",
      //         style: "",
      //         format: "image/png",
      //         tileMatrixSetID: "EPSG:4490_test",
      //         tileMatrixLabels: ysLabels,
      //         tilingScheme: new global.DC.Namespace.Cesium.GeographicTilingScheme(),
      //     })
      // )
    },

    switchElec() {
      // 天地图 矢量
      this.imgtype = 1;

      baseLayers.length &&
        baseLayers.forEach((item) => {
          item && global.viewer.imageryLayers.remove(item);
        });

      baseLayers = [];

      baseLayers.push(
        global.viewer.imageryLayers.addImageryProvider(
          new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
            url: `${window.BASE_URL_CONFIG.VUE_APP_MAP_SL}/MapTileService/wmts?STORETYPE=merged-dat&PROJECTION=4326`,
            layer: "wmts_4326_361100",
            style: "default",
            format: "image/png",
            tileMatrixSetID: "c",
            tileMatrixLabels: new Array(20).fill(0).map((v, i) => i + 1),
            tilingScheme:
              new global.DC.Namespace.Cesium.GeographicTilingScheme(),
          })
        )
      );

      baseLayers.contrast = 1.0;
    },

    addTerrain() {
      projectTerrain = global.DC.TerrainFactory.createUrlTerrain({
        // url: `http://data.marsgis.cn/terrain`
        url: `${window.BASE_URL_CONFIG.VUE_APP_MAP_DX}`,
      });

      global.viewer.addTerrain(projectTerrain);
    },

    removeTerrain() {
      global.viewer.removeTerrain(projectTerrain);
    },

    /**
     * @description: 全屏控制
     * @return {*} 无返回值
     */
    fullscreenchange() {
      // 最新写法
      const isFullScreen = document.fullscreenElement;
      if (isFullScreen) {
        if (document.exitFullscreen) {
          document.exitFullscreen();
        } else if (document.msExitFullscreen) {
          document.msExitFullscreen();
        } else if (document.mozCancelFullScreen) {
          document.mozCancelFullScreen();
        } else if (document.webkitCancelFullScreen) {
          document.webkitCancelFullScreen();
        }
        this.isFullscreen = false;
      } else {
        var fullscreen = document.body; // 需要全屏的元素
        if (fullscreen.requestFullscreen) {
          fullscreen.requestFullscreen();
        } else if (fullscreen.mozRequestFullScreen) {
          fullscreen.mozRequestFullScreen();
        } else if (fullscreen.webkitRequestFullscreen) {
          fullscreen.webkitRequestFullscreen();
        } else if (fullscreen.msRequestFullscreen) {
          fullscreen.msRequestFullscreen();
        }
        this.isFullscreen = true;
      }
    },

    // 切换首页显示隐藏
    switchShowHomeContent() {
      this.$store.commit(
        "SET_ISSHOWHOMECONTENT",
        !this.$store.state.popupParams.isShowHomeContent
      );
      if (this.$store.state.popupParams.isShowHomeContent) {
        // if (document.querySelector('.dc-container .dc-zoom-controller').classList.contains('homebottom')) return
        document
          .querySelector(".dc-container .dc-zoom-controller")
          .classList.add("homebottom");
        document.querySelector(".screen-full-btn").classList.add("homebottom");
        document.querySelector(".over-look-btn").classList.add("homebottom");
        document.querySelector(".compass-btn").classList.add("homebottom");
        document
          .querySelector(".image-switch-icon-btn")
          .classList.add("iconbottom");
      } else {
        // if (!document.querySelector('.dc-container .dc-zoom-controller').classList.contains('homebottom')) return
        document
          .querySelector(".dc-container .dc-zoom-controller")
          .classList.remove("homebottom");
        document
          .querySelector(".screen-full-btn")
          .classList.remove("homebottom");
        document.querySelector(".over-look-btn").classList.remove("homebottom");
        document.querySelector(".compass-btn").classList.remove("homebottom");
        document
          .querySelector(".image-switch-icon-btn")
          .classList.remove("iconbottom");
      }
    },

    /**
     * 在图层中添加实体(点)
     * @param {*} item 图标
     * @param {*} url 图标地址
     */
    addSiteEntity(item, url) {
      const billboard = new global.DC.Billboard(
        new global.DC.Position(Number(item.lng), Number(item.lat)),
        url
      );
      billboard.size = [20, 28];
      billboard.attrParams = item;
      siteEntitylayers.addOverlay(billboard);
    },

    /**
     * 添加图层
     * @param {*} layerName 图层名称
     * @param {*} type 图层类型
     */
    mapAddLayer(layerName, type, ClusterLayerType) {
      if (!layersObjcect[layerName]) {
        this.mapRemoveLayer(layerName, type);
        layersObjcect[layerName] = null;
      }

      if (type == "VectorLayer") {
        layersObjcect[layerName] = new global.DC.VectorLayer(layerName);
      } else if (type == "ClusterLayer") {
        layersObjcect[layerName] = new global.DC.ClusterLayer(layerName, {
          pixelRange: 40,
          style: ClusterLayerType,
        });
      } else if (type == "HeatLayer") {
        layersObjcect[layerName] = new global.DC.HeatLayer(layerName, {
          gradient: {
            0.5: "green",
            0.6: "orange",
            0.95: "red",
          }, //颜色设置
          height: 0, // 高度
          radius: 100, // 半径
          useGround: false, //是否使用贴地模式
          classificationType: 2, //分类 是否影响地形，3D切片或同时影响这两者。0:地形、1:3D切片、2：两者。贴地模式下生效
        });
      }

      global.viewer.addLayer(layersObjcect[layerName]);
    },

    /**
     * 删除图层
     * @param {*} layerName 图层名称
     * @param {*} type 图层类型
     */
    mapRemoveLayer(layerName, type) {
      if (
        type == "VectorLayer" ||
        type == "ClusterLayer" ||
        type == "HeatLayer"
      ) {
        if (layersObjcect[layerName] && layersObjcect[layerName] != null) {
          layersObjcect[layerName].remove();
          layersObjcect[layerName] = null;
        }
      }
    },

    /**
     * 删除图层指定面
     * @param {*} layerName 图层名称
     * @param {*} polygonName 面名称
     * @param {*} type 图层类型
     */
    mapRemovePolygonLayer(layerName, polygonName, type) {
      if (
        type == "VectorLayer" ||
        type == "ClusterLayer" ||
        type == "HeatLayer"
      ) {
        if (
          layersObjcect[layerName] &&
          layersObjcect[layerName] != null &&
          polygonObj[polygonName] &&
          polygonObj[polygonName] != null
        ) {
          layersObjcect[layerName].removeOverlay(polygonObj[polygonName]);
        }
      }
    },

    mapRemovePolygon(layerName, overlay, type) {
      if (type == "VectorLayer") {
        if (layersObjcect[layerName] && layersObjcect[layerName] != null) {
          layersObjcect[layerName].removeOverlay(overlay);
        }
      }
    },

    /**
     * 清空图层
     * @param {*} layerName 图层名称
     * @param {*} type 图层类型
     */
    mapClearLayer(layerName, type) {
      if (
        type == "VectorLayer" ||
        type == "ClusterLayer" ||
        type == "HeatLayer"
      ) {
        if (layersObjcect[layerName] && layersObjcect[layerName] != null)
          layersObjcect[layerName].clear();
      }
    },

    /**
     * 图层点添加
     * @param {*} layerName 图层名称
     * @param {*} type 添加的点位类型
     * @param {*} params 添加的点位参数（内容、详情）
     * @param {*} incident 添加的点位事件
     */

    layerPointAdd(
      layerName,
      type,
      layerType = "VectorLayer",
      params,
      distanceDisplayCondition = {
        near: 0, //最近距离
        far: Number.MAX_VALUE, //最远距离
      },
      incident = (e) => {},
      mouseOverIncident = (e) => {},
      mouseOutIncident = (e) => {},
      pointMouseMove = (e) => {}
    ) {
      if (!layersObjcect[layerName] || layersObjcect[layerName] == null) {
        this.mapAddLayer(layerName, layerType, params.ClusterLayerType);
      }

      let pointElement;
      let labelElement;

      if (type == "billboard") {
        // pointElement = new global.DC.Billboard(new global.DC.Position(Number(params.lng), Number(params.lat), Number(alt)), params.url)
        pointElement = new global.DC.Billboard(
          new global.DC.Position(Number(params.lng), Number(params.lat), 0),
          params.url
        );
        pointElement.setStyle(params.setStyle);
        pointElement.size = params.size || [32, 32];
        pointElement.style = "clustering";
        pointElement.attrParams = params;
        layersObjcect[layerName].addOverlay(pointElement);
        pointElement.on(global.DC.MouseEventType.CLICK, incident);
        pointElement.on(global.DC.MouseEventType.MOUSE_OVER, mouseOverIncident);
        pointElement.on(global.DC.MouseEventType.MOUSE_OUT, mouseOutIncident);
        pointElement.on(global.DC.MouseEventType.MOUSE_MOVE, pointMouseMove);
      } else if (type == "label") {
        // labelElement = new global.DC.Label(new global.DC.Position(Number(params.lng), Number(params.lat), Number(alt)), params.text)
        labelElement = new global.DC.Label(
          new global.DC.Position(Number(params.lng), Number(params.lat), 0),
          params.text
        );
        let fontColor =
          "fontColor" in params ? params.fontColor : global.DC.Color.CRIMSON;
        let style =
          "fontColor" in params
            ? global.DC.Namespace.Cesium.LabelStyle.FILL
            : global.DC.Namespace.Cesium.LabelStyle.FILL_AND_OUTLINE;
        labelElement.setStyle({
          style: style,
          fillColor: fontColor,
          outlineColor: global.DC.Color.WHITE, // 边框颜色
          outlineWidth: params.outW || 4, // 边框大小，
          font: "16px sans-serif",
          pixelOffset: { x: 0, y: -30 },
          distanceDisplayCondition: distanceDisplayCondition,
        });
        labelElement.attrParams = params;
        layersObjcect[layerName].addOverlay(labelElement);
        labelElement.on(global.DC.MouseEventType.CLICK, incident);
      } else if (type == "billboardOrLabel") {
        let allSite = layersObjcect[layerName].getOverlays();

        let flag = allSite.filter((item) => item.attrParams.id == params.id);

        if (flag == true) {
          return;
        }

        // pointElement = new global.DC.Billboard(new global.DC.Position(Number(params.lng), Number(params.lat), Number(alt)), params.url)
        pointElement = new global.DC.Billboard(
          new global.DC.Position(Number(params.lng), Number(params.lat), 0),
          params.url
        );
        pointElement.setStyle(params.setStyle);
        pointElement.size = params.size || [32, 32];
        pointElement.style = "clustering";
        pointElement.attrParams = params;
        layersObjcect[layerName].addOverlay(pointElement);
        pointElement.on(global.DC.MouseEventType.CLICK, incident);
        pointElement.on(global.DC.MouseEventType.MOUSE_OVER, mouseOverIncident);
        pointElement.on(global.DC.MouseEventType.MOUSE_OUT, mouseOutIncident);
        pointElement.on(global.DC.MouseEventType.MOUSE_MOVE, pointMouseMove);

        // labelElement = new global.DC.Label(new global.DC.Position(Number(params.lng), Number(params.lat), Number(alt)), params.text)
        labelElement = new global.DC.Label(
          new global.DC.Position(Number(params.lng), Number(params.lat), 0),
          String(params.text)
        );
        let fontColor =
          "fontColor" in params ? params.fontColor : global.DC.Color.CRIMSON;
        let style =
          "fontColor" in params
            ? global.DC.Namespace.Cesium.LabelStyle.FILL
            : global.DC.Namespace.Cesium.LabelStyle.FILL_AND_OUTLINE;
        labelElement.setStyle({
          style: style,
          fillColor: fontColor,
          outlineColor: global.DC.Color.WHITE, // 边框颜色
          outlineWidth: params.outW || 4, // 边框大小，
          font: "16px sans-serif",
          pixelOffset: { x: 0, y: -30 },
          distanceDisplayCondition: distanceDisplayCondition,
          ...params.setStyle,
        });
        labelElement.attrParams = params;
        layersObjcect[layerName].addOverlay(labelElement);
        labelElement.on(global.DC.MouseEventType.CLICK, incident);
      } else if (type == "HeatPoint") {
        layersObjcect[layerName].setPositions(params.positions);
      } else if (type == "newBillboard") {
        // pointElement = new global.DC.Billboard(new global.DC.Position(Number(params.lng), Number(params.lat), Number(alt)), params.url)
        pointElement = new global.DC.Billboard(
          new global.DC.Position(Number(params.lng), Number(params.lat), 0),
          params.url
        );
        pointElement.setStyle(params.setStyle);
        pointElement.size = params.size || [32, 32];
        pointElement.style = "clustering";
        pointElement.attrParams = params;
        layersObjcect[layerName].addOverlay(pointElement);
        pointElement.on(global.DC.MouseEventType.CLICK, incident);
        pointElement.on(global.DC.MouseEventType.MOUSE_OVER, mouseOverIncident);
        pointElement.on(global.DC.MouseEventType.MOUSE_OUT, mouseOutIncident);
        pointElement.on(global.DC.MouseEventType.MOUSE_MOVE, pointMouseMove);
      }
    },

    /**
     * 删除图层指定点
     * @param {*} layerName 图层名称
     * @param {*} siteId 点ID
     */
    mapRemoveSiteLayer(layerName, siteId) {
      if (layersObjcect[layerName]) {
        let allSite = layersObjcect[layerName].getOverlays();

        allSite
          .filter((item) => item.attrParams.id == siteId)
          .forEach((item) => layersObjcect[layerName].removeOverlay(item));
      }
    },

    /**
     * 图层面添加
     * @param {*} layerName 图层名称
     * @param {*} positions 图层位置数据
     * @param {*} material 颜色
     * @param {*} distanceDisplayCondition 可见距离
     */
    layerPolygonAdd(
      layerName,
      positions,
      material,
      distanceDisplayCondition,
      polygonName,
      params,
      incident = (e) => {},
      mouseOverIncident = (e) => {},
      mouseOutIncident = (e) => {},
      setStyle = {}
    ) {
      if (!layersObjcect[layerName] || layersObjcect[layerName] == null) {
        this.mapAddLayer(layerName, "VectorLayer");

        layersObjcect[layerName].allowDrillPicking = true;
      }
      // let polygon = new global.DC.Polygon(positions)
      // let polygonObj = {}//要在全局定义
      polygonObj[polygonName] = new global.DC.Polygon(positions);
      // polygon.setStyle({
      polygonObj[polygonName].setStyle({
        material: material,
        distanceDisplayCondition: distanceDisplayCondition,
        perPositionHeight: true,
        ...setStyle,
      });
      // layersObjcect[layerName].addOverlay(polygon)
      polygonObj[polygonName].attrParams = params;
      polygonObj[polygonName].on(global.DC.MouseEventType.CLICK, incident);
      polygonObj[polygonName].on(
        global.DC.MouseEventType.MOUSE_OVER,
        mouseOverIncident
      );
      polygonObj[polygonName].on(
        global.DC.MouseEventType.MOUSE_OUT,
        mouseOutIncident
      );
      layersObjcect[layerName].addOverlay(polygonObj[polygonName]);
    },

    /**
     * 图层面添加
     * @param {*} layerName 图层名称
     * @param {*} positions 图层位置数据
     * @param {*} material 颜色
     * @param {*} distanceDisplayCondition 可见距离
     */
    layerPolygonArrowsAdd(
      layerName,
      positions,
      material,
      polygonName = "",
      params,
      incident = (e) => {},
      mouseOverIncident = (e) => {},
      mouseOutIncident = (e) => {},
      setStyle = {}
    ) {
      if (!layersObjcect[layerName] || layersObjcect[layerName] == null) {
        this.mapAddLayer(layerName, "VectorLayer");

        layersObjcect[layerName].allowDrillPicking = true;
      }

      if (polygonName == "") {
        polygonName = layerName + params.id;
      }

      polygonObj[polygonName] = new global.DC.Polyline(positions);

      let positionData = positions
        .split(";")
        .map((item) => {
          return [Number(item.split(",")[0]), Number(item.split(",")[1])];
        })
        .filter((item) => {
          return !item.some((it) => it == 0);
        });

      console.log(params.width, 15);

      polygonObj[polygonName].setStyle({
        width: params.width,
        material: new global.DC.PolylineImageTrailMaterialProperty({
          color: new global.DC.Color(255, 255, 255),
          speed: 20,
          image: "/images/arrows.png",
          repeat: {
            x: getLineSpeed(positionData) / 2,
            y: 1,
          },
        }),
        distanceDisplayCondition: {
          near: 0, //最近距离
          far: 2000, //最远距离
        },
        clampToGround: false,
        ...setStyle,
      });

      polygonObj[polygonName].attrParams = params;
      layersObjcect[layerName].addOverlay(polygonObj[polygonName]);
    },

    /**
     * 图层线添加
     * @param {*} layerName 图层名称
     * @param {*} positions 图层位置数据
     * @param {*} material 颜色
     * @param {*} width 宽度
     */
    layerPolylineAdd(
      layerName,
      positions,
      material,
      width,
      params,
      incident = (e) => {}
    ) {
      if (!layersObjcect[layerName] || layersObjcect[layerName] == null) {
        this.mapAddLayer(layerName, "VectorLayer");

        layersObjcect[layerName].allowDrillPicking = true;
      }

      let polyline = new global.DC.Polyline(positions);

      polyline.setStyle({
        width: width,
        material: material,
        clampToGround: false,
      });
      polyline.attrParams = params;
      polyline.on(global.DC.MouseEventType.CLICK, incident);

      layersObjcect[layerName].addOverlay(polyline);
    },

    layerWallAdd(layerName, positions) {
      if (!layersObjcect[layerName] || layersObjcect[layerName] == null) {
        this.mapAddLayer(layerName, "VectorLayer");
      }

      let wall = new global.DC.Wall(positions);
      wall.setStyle({
        material: new global.DC.WallTrailMaterialProperty({
          color: global.DC.Namespace.Cesium.Color.fromBytes(255, 0, 0, 180),
          speed: 10,
        }),
      });
      layersObjcect[layerName].addOverlay(wall);
    },

    rowLayerWallAdd(layerName, positions) {
      if (!layersObjcect[layerName] || layersObjcect[layerName] == null) {
        this.mapAddLayer(layerName, "VectorLayer");
      }

      let wall = new global.DC.Wall(positions);
      wall.setStyle({
        material: new global.DC.WallImageTrailMaterialProperty({
          image: "/images/jjx.png",
          color: global.DC.Namespace.Cesium.Color.fromBytes(255, 255, 0, 180),
          repeat: { x: 20, y: 1 },
          speed: 10,
        }),
      });
      layersObjcect[layerName].addOverlay(wall);
    },

    /**
     * @description: 通过ID获取图层
     * @return {*}
     */
    getOverLayerID(layerName, ids = [], cb) {
      const data = ids.reduce((pre, cur) => {
        if (
          layersObjcect[layerName].getOverlay(cur.overlayId) &&
          layersObjcect[layerName].getOverlay(cur.overlayId) != undefined &&
          layersObjcect[layerName].getOverlay(cur.overlayId) != null &&
          layersObjcect[layerName].getOverlay(cur.overlayId) != ""
        ) {
          pre.push(
            layersObjcect[layerName].getOverlay(cur.overlayId).attrParams
          );
        } else {
          layersObjcect[layerName].eachOverlay((item) => {
            if (item.overlayId == cur.overlayId) pre.push(item.attrParams);
          });
        }

        return pre;
      }, []);

      cb(data);
    },

    /**
     * 图层显示隐藏
     * @param {*} layerName 图层名称
     * @param {*} flag 显示隐藏
     */
    layerShow(layerName, flag) {
      if (layersObjcect[layerName]) layersObjcect[layerName].show = flag;
    },

    /**
     * 飞到指定位置
     * @param {*} siteJd 经度
     * @param {*} siteWd 纬度
     * @param {*} siteGd 高度，默认0
     * @param {*} siteHeading 偏航角度，默认0
     * @param {*} sitePitch 俯仰角度，默认0
     * @param {*} siteRoll 翻转角度，默认0
     * @param {*} time 飞行时间，默认3秒
     */
    toPosition(
      siteJd,
      siteWd,
      siteGd = 2000,
      siteHeading = 0,
      sitePitch = -90,
      siteRoll = 0,
      time = 3
    ) {
      global.viewer.flyToPosition(
        new global.DC.Position(
          Number(siteJd),
          Number(siteWd),
          Number(siteGd),
          Number(siteHeading),
          Number(sitePitch),
          Number(siteRoll)
        ),
        function () {},
        time
      );
    },
    // sdTilesetLayer

    /**
     * 飞到指定范围
     * @param {*} polygonName 范围名称
     * @param {*} duration 时间
     */
    flytoLayer(polygonName, duration = 3) {
      global.viewer.flyTo(polygonObj[polygonName], duration);
    },

    /**
     * 添加模型
     * @param {*} titlesetName 图层名称
     * @param {*} titlesetUrl 模型地址
     * @param {*} incident 模型点击事件
     */
    addMxTileset(titlesetName, titlesetUrl, conf) {
      if (!tilesetObject[titlesetName]) tilesetObject[titlesetName] = null;

      tilesetObject[titlesetName] = new global.DC.Tileset(titlesetUrl, {
        luminanceAtZenith: 0.4,
        // cullWithChildrenBounds: false,
        // cullRequestsWhileMoving: false,
        // skipLevelOfDetail: false,
        maximumScreenSpaceError: conf.maximumScreenSpaceError || 16,
        shadows: global.DC.Namespace.Cesium.ShadowMode.DISABLED,
      });

      // 地形数据添加
      tilesetObject[titlesetName].setHeight(-73);

      tilesetLayer.addOverlay(tilesetObject[titlesetName]);

      // global.viewer.flyTo(tilesetObject[titlesetName])removeMxTileset
    },

    tilesetLayerFlag(type, cb) {
      if (type == 1) {
        if (this.tilesetLayerType != "") {
          this.$message({
            message: "请关闭模型再开始绘制",
            type: "warning",
          });

          cb(false);
          return;
        }
      } else {
        if (this.tilesetLayerType == "") {
          this.$message({
            message: "请打开模型再开始绘制",
            type: "warning",
          });

          cb(false);
          return;
        }
      }

      cb(true);
    },

    /**
     * 删除模型
     * @param {*} titlesetName 图层名称
     * @param {*} incident 模型点击事件
     */
    removeMxTileset(titlesetName) {
      if (tilesetObject[titlesetName] && tilesetObject[titlesetName] != null) {
        tilesetLayer.removeOverlay(tilesetObject[titlesetName]);
        tilesetObject[titlesetName] = null;
      }
    },

    /**
     * 建筑高亮显示
     * @param {*} positions 建筑范围坐标
     * @param {*}
     */
    showThreeDimensions(positions, minHeight, maxHeight) {
      console.log("showThreeDimensions--map");
      if (curPolygon != null) {
        global.viewer.scene.primitives.remove(curPolygon);
        curPolygon = null;
      }

      let housePositions = JSON.parse(positions).coordinates[0];

      let floorPositions = housePositions.reduce((prev, curr) => {
        prev.push(curr[0]);
        prev.push(curr[1]);

        return prev;
      }, []);

      curPolygon = new global.DC.Namespace.Cesium.ClassificationPrimitive({
        geometryInstances: new global.DC.Namespace.Cesium.GeometryInstance({
          geometry: new global.DC.Namespace.Cesium.PolygonGeometry({
            polygonHierarchy: new global.DC.Namespace.Cesium.PolygonHierarchy(
              global.DC.Namespace.Cesium.Cartesian3.fromDegreesArray(
                floorPositions
              )
            ),
            extrudedHeight: maxHeight - 73, //分层顶部海拔
            height: minHeight - 73, //分层底部海拔
          }),

          attributes: {
            color:
              global.DC.Namespace.Cesium.ColorGeometryInstanceAttribute.fromColor(
                global.DC.Namespace.Cesium.Color.RED.withAlpha(0.5)
              ),
            show: new global.DC.Namespace.Cesium.ShowGeometryInstanceAttribute(
              true
            ),
          },
        }),

        classificationType:
          global.DC.Namespace.Cesium.ClassificationType.CESIUM_3D_TILE,
      });

      global.viewer.scene.primitives.add(curPolygon);
    },

    // 建筑高亮切换显示隐藏
    switchThreeDimensions(boolean) {
      if (!curPolygon) return;
      curPolygon.show = boolean;
    },

    // 清除建筑3D
    clearHouse3D() {
      global.viewer.scene.primitives.remove(curPolygon);

      curPolygon = null;
    },

    registerMxClick(event) {
      this.unbindMxClick();
      window.TILESET_LABEL.forEach((item) => {
        if (
          tilesetObject[`sdTilesetLayer${item.name}`] &&
          tilesetObject[`sdTilesetLayer${item.name}`] != null
        ) {
          tilesetObject[`sdTilesetLayer${item.name}`].on(
            global.DC.MouseEventType.CLICK,
            event
          );
        }
      });
    },

    unbindMxClick(event) {
      window.TILESET_LABEL.forEach((item) => {
        if (
          tilesetObject[`sdTilesetLayer${item.name}`] &&
          tilesetObject[`sdTilesetLayer${item.name}`] != null
        ) {
          tilesetObject[`sdTilesetLayer${item.name}`].off(
            global.DC.MouseEventType.CLICK,
            event
          );
        }
      });
    },
  },

  destroyed() {
    this.$EventBus.$off("mapAddLayer");
    this.$EventBus.$off("mapRemoveLayer");
    this.$EventBus.$off("mapRemovePolygonLayer");
    this.$EventBus.$off("mapRemoveSiteLayer");
    this.$EventBus.$off("mapRemovePolygon");
    this.$EventBus.$off("mapClearLayer");
    this.$EventBus.$off("layerPointAdd");
    this.$EventBus.$off("layerPolygonAdd");
    this.$EventBus.$off("layerPolygonArrowsAdd");
    this.$EventBus.$off("layerPolylineAdd");
    this.$EventBus.$off("layerWallAdd");
    this.$EventBus.$off("rowLayerWallAdd");
    this.$EventBus.$off("getOverLayerID");
    this.$EventBus.$off("layerShow");
    this.$EventBus.$off("toPosition");
    this.$EventBus.$off("highOrLightChange");
    this.$EventBus.$off("addMxTileset");
    this.$EventBus.$off("closeMxTileset");
    this.$EventBus.$off("tilesetLayerFlag");
    this.$EventBus.$off("removeMxTileset");
    this.$EventBus.$off("flytoLayer");
    this.$EventBus.$off("showThreeDimensions");
    this.$EventBus.$off("switchThreeDimensions");
    this.$EventBus.$off("clearHouse3D");
    this.$EventBus.$off("registerMxClick");
    this.$EventBus.$off("unbindMxClick");
  },
};
</script>

<style lang="scss" scope>
.viewer-box {
    position: relative;
    width: 100%;
    height: 100%;
  position: relative;
  width: 100%;
  height: 100%;
}
</style>