二维码扫码与PC端DC使用方式更换

shuishen

2022-03-08 368cadf28a912e35bd9d8017588cb0aefffc7b79

二维码扫码与PC端DC使用方式更换

 src/App.vue

@@ -44,19 +44,21 @@
        // check();
        // console.log(this.getQueryString("data"), "window.location");
        // var reg = new RegExp("(^|&)" + "data" + "=([^&]*)(&|$)");

        var data = {}

        var url = window.location.href
        var arr = url.split('?')
        var brr = arr[1].split('&')
        brr.forEach((item, index) => {
            var a = item.split('=')
            data[a[0]] = decodeURIComponent(a[1])
        })
        try {
            data = JSON.parse(data)
        } catch (error) { }

        if (url.indexOf('?') != -1) {
            var arr = url.split('?')
            var brr = arr[1].split('&')
            brr.forEach((item, index) => {
                var a = item.split('=')
                data[a[0]] = decodeURIComponent(a[1])
            })
            try {
                data = JSON.parse(data)
            } catch (error) { }
        }

        this.$store.commit('set_urlParameterData', data) // 传入数据


 src/components/arcNavBar/index.vue

@@ -1,212 +1,204 @@
<template>
  <public-box class="public-org-nav-bar">
    <template slot="public-box-header">
      <div class="title">
        <img class="icon deblurring" src="/img/icon/xyjz.png" alt />
        <span>{{ arcNavBarTitle }}</span>
      </div>
      <img class="close" src="/img/navicon/close.png" alt @click="closeModel" />
    </template>
    <template slot="public-box-content">
      <div class="tab" v-show="false">
        <ul>
          <li
            :class="{ on: item.flag }"
            v-for="(item, index) in titleList"
            :key="index"
            @click="topNavClick(item, index)"
          >
            {{ item.title }}
          </li>
        </ul>
      </div>
      <ul>
        <li
          v-for="(item, index) in itemNavList"
          :key="index"
          @click="mapPopup(item)"
        >
          <img :src="item.icon" alt />
          <span>{{ item.navTitle }}</span>
        </li>
      </ul>
    </template>
  </public-box>
    <public-box class="public-org-nav-bar">
        <template slot="public-box-header">
            <div class="title">
                <img class="icon deblurring" src="/img/icon/xyjz.png" alt />
                <span>{{ arcNavBarTitle }}</span>
            </div>
            <img class="close" src="/img/navicon/close.png" alt @click="closeModel" />
        </template>
        <template slot="public-box-content">
            <div class="tab" v-show="false">
                <ul>
                    <li
                        :class="{ on: item.flag }"
                        v-for="(item, index) in titleList"
                        :key="index"
                        @click="topNavClick(item, index)"
                    >{{ item.title }}</li>
                </ul>
            </div>
            <ul>
                <li v-for="(item, index) in itemNavList" :key="index" @click="mapPopup(item)">
                    <img :src="item.icon" alt />
                    <span>{{ item.navTitle }}</span>
                </li>
            </ul>
        </template>
    </public-box>
</template>

<script>
import { mapGetters } from "vuex";
import { mapGetters } from 'vuex'
import {
  getList,
  getChildNavList,
  getChildNavDetail,
} from "@/api/pc/public/arc";
    getList,
    getChildNavList,
    getChildNavDetail
} from '@/api/pc/public/arc'

export default {
  name: "ArcNavBar",
  data() {
    return {
      itemNavList: [],
      titleList: [],
      DC: null,
    };
  },
  props: {},
  computed: {
    ...mapGetters([
      "viewer",
      "popupBgUrl",
      "pupupQRUrl",
      // 点信息
      "pointPosition",
      // 点名称
      "stateName",
      // 地址
      "siteName",
      // 介绍
      "introduceText",
      // 全景地址
      "panoramaUrl",
      "arcNavBarTitle",
      "arcNavBarCode",
    ]),
  },
  created() {
    this.DC = global.DC;
  },
  mounted() {},
  watch: {
    arcNavBarCode: {
      immediate: true,
      handler(newCode, oldCode) {
        this.titleList = [];
        getList().then((res) => {
          res.data.data.forEach((item) => {
            this.titleList.push({
              title: item.dictValue,
              flag: false,
              key: item.dictKey,
            });
          });

          this.titleList[0].flag = true;

          this.getChilsNavs(this.titleList[0].key);
        });
      },
    },
  },
  methods: {
    topNavClick(item, index) {
      this.titleList.forEach((item) => {
        item.flag = false;
      });

      this.titleList[index].flag = true;

      this.getChilsNavs(item.key);
    },

    getChilsNavs(campus) {
      this.itemNavList = [];

      getChildNavList({ campus: campus, type: this.arcNavBarCode }).then(
        (res) => {
          res.data.data.forEach((item) => {
            this.itemNavList.push({
              navTitle: item.mechanismname,
              icon: "/img/navicon/tag.png",
              id: item.id,
            });
          });
    name: 'ArcNavBar',
    data () {
        return {
            itemNavList: [],
            titleList: []
        }
      );
    },
    props: {},
    computed: {
        ...mapGetters([
            'viewer',
            'popupBgUrl',
            'pupupQRUrl',
            // 点信息
            'pointPosition',
            // 点名称
            'stateName',
            // 地址
            'siteName',
            // 介绍
            'introduceText',
            // 全景地址
            'panoramaUrl',
            'arcNavBarTitle',
            'arcNavBarCode'
        ])
    },
    created () {
    },
    mounted () { },
    watch: {
        arcNavBarCode: {
            immediate: true,
            handler (newCode, oldCode) {
                this.titleList = []
                getList().then((res) => {
                    res.data.data.forEach((item) => {
                        this.titleList.push({
                            title: item.dictValue,
                            flag: false,
                            key: item.dictKey
                        })
                    })

    mapPopup(param) {
      getChildNavDetail({ id: param.id }).then((res) => {
        var result = res.data.data[0].list;
        this.$store.commit("CLEAR_ALL", null);
                    this.titleList[0].flag = true

        var imgArr = result.tpurl.split(",");

        this.$store.commit("SET_POPUPBGURL", imgArr[0]);
        this.$store.commit("SET_POPUPQRURL", result.codeurl);
        this.$store.commit("SET_POINTPOSITION", [
          Number(result.jd),
          Number(result.wd),
          Number(result.gd),
          Number(result.heading),
          Number(result.pitch),
          Number(result.roll),
        ]);
        this.$store.commit("SET_STATENAME", result.mechanismname);
        this.$store.commit("SET_SITENAME", result.address);
        this.$store.commit("SET_TELEPHONE", result.telephone);
        this.$store.commit("SET_INTRODUCETEXT", result.introduce);
        this.$store.commit("SET_PANORAMAURL", result.panoramaurl);
        this.$store.commit("SET_POPUPIMGATLAS", imgArr);
        if (result.videourl && result.videourl != "") {
          this.$store.commit("SET_MONITORURL", result.videourl);
                    this.getChilsNavs(this.titleList[0].key)
                })
            }
        }
        if (res.data.data[0].jx != undefined && res.data.data[0].jx != "") {
          var tabOne = res.data.data[0].jx.split(",");
          this.$store.commit("SET_TEACHLIST", tabOne);
        } else {
          this.$store.commit("SET_TEACHLIST", []);
    },
    methods: {
        topNavClick (item, index) {
            this.titleList.forEach((item) => {
                item.flag = false
            })

            this.titleList[index].flag = true

            this.getChilsNavs(item.key)
        },

        getChilsNavs (campus) {
            this.itemNavList = []

            getChildNavList({ campus: campus, type: this.arcNavBarCode }).then(
                (res) => {
                    res.data.data.forEach((item) => {
                        this.itemNavList.push({
                            navTitle: item.mechanismname,
                            icon: '/img/navicon/tag.png',
                            id: item.id
                        })
                    })
                }
            )
        },

        mapPopup (param) {
            getChildNavDetail({ id: param.id }).then((res) => {
                var result = res.data.data[0].list
                this.$store.commit('CLEAR_ALL', null)

                var imgArr = result.tpurl.split(',')

                this.$store.commit('SET_POPUPBGURL', imgArr[0])
                this.$store.commit('SET_POPUPQRURL', result.codeurl)
                this.$store.commit('SET_POINTPOSITION', [
                    Number(result.jd),
                    Number(result.wd),
                    Number(result.gd),
                    Number(result.heading),
                    Number(result.pitch),
                    Number(result.roll)
                ])
                this.$store.commit('SET_STATENAME', result.mechanismname)
                this.$store.commit('SET_SITENAME', result.address)
                this.$store.commit('SET_TELEPHONE', result.telephone)
                this.$store.commit('SET_INTRODUCETEXT', result.introduce)
                this.$store.commit('SET_PANORAMAURL', result.panoramaurl)
                this.$store.commit('SET_POPUPIMGATLAS', imgArr)
                if (result.videourl && result.videourl != '') {
                    this.$store.commit('SET_MONITORURL', result.videourl)
                }
                if (res.data.data[0].jx != undefined && res.data.data[0].jx != '') {
                    var tabOne = res.data.data[0].jx.split(',')
                    this.$store.commit('SET_TEACHLIST', tabOne)
                } else {
                    this.$store.commit('SET_TEACHLIST', [])
                }

                if (res.data.data[0].sh != undefined && res.data.data[0].sh != '') {
                    var tabTwo = res.data.data[0].sh.split(',')
                    this.$store.commit('SET_LIVELIST', tabTwo)
                } else {
                    this.$store.commit('SET_LIVELIST', [])
                }

                this.newPopup(result)
                this.viewer.flyToPosition(
                    new global.DC.Position(
                        Number(result.jd),
                        Number(result.wd),
                        300,
                        Number(result.heading),
                        Number(result.pitch),
                        Number(result.roll)
                    ),
                    function () { },
                    3
                )
            })
        },

        newPopup (item) {
            const position = global.DC.Transform.transformWGS84ToCartesian(
                new global.DC.Position(Number(item.jd), Number(item.wd), Number(item.gd))
            )
            // eslint-disable-next-line no-unused-vars
            var popup = new global.DC.DivForms(this.viewer, {
                domId: 'divFormsDomBox',
                position: [position]
            })

            this.$store.commit('SET_PANORAMAPOPUP', false)
            this.$store.commit('SET_MONITORPOPUP', false)
            this.$store.commit('SET_DETAILSPOPUP', true)
        },

        closeModel () {
            var path = this.$route.path
            if (path.indexOf('/arc') != -1) {
                this.$store.dispatch('delVisitedViews', this.$route)
                this.$router.push('/pcLayout/default')
            }

            this.$store.commit('SET_ARCNAVBARTITLE', '')
            this.$store.commit('SET_ARCNAVBARCODE', '')
            this.$store.commit('SET_ARCNAVBARFLAG', false)
        }

        if (res.data.data[0].sh != undefined && res.data.data[0].sh != "") {
          var tabTwo = res.data.data[0].sh.split(",");
          this.$store.commit("SET_LIVELIST", tabTwo);
        } else {
          this.$store.commit("SET_LIVELIST", []);
        }

        this.newPopup(result);
        this.viewer.flyToPosition(
          new this.DC.Position(
            Number(result.jd),
            Number(result.wd),
            300,
            Number(result.heading),
            Number(result.pitch),
            Number(result.roll)
          ),
          function () {},
          3
        );
      });
    },

    newPopup(item) {
      const position = this.DC.Transform.transformWGS84ToCartesian(
        new this.DC.Position(Number(item.jd), Number(item.wd), Number(item.gd))
      );
      // eslint-disable-next-line no-unused-vars
      var popup = new this.DC.DivForms(this.viewer, {
        domId: "divFormsDomBox",
        position: [position],
      });

      this.$store.commit("SET_PANORAMAPOPUP", false);
      this.$store.commit("SET_MONITORPOPUP", false);
      this.$store.commit("SET_DETAILSPOPUP", true);
    },

    closeModel() {
      var path = this.$route.path;
      if (path.indexOf("/arc") != -1) {
        this.$store.dispatch("delVisitedViews", this.$route);
        this.$router.push("/pcLayout/default");
      }

      this.$store.commit("SET_ARCNAVBARTITLE", "");
      this.$store.commit("SET_ARCNAVBARCODE", "");
      this.$store.commit("SET_ARCNAVBARFLAG", false);
    },
  },
};
    }
}
</script>

<style scoped lang="scss"></style>

 src/components/campusNav/index.vue

@@ -79,7 +79,6 @@
        return {
            tabOneFlag: true,
            tabTwoFlag: false,
            DC: null,
            navigationWay: '步行',
            routeLayer: null,
            toNameText: '',
@@ -142,7 +141,6 @@
        }
    },
    created () {
        this.DC = global.DC
    },
    mounted () {
        const leftBut = document.querySelectorAll('.el-input-group__prepend')
@@ -163,15 +161,15 @@
                if (val == 'start') {
                    // 初始化图标图层
                    if (this.endLayer == null) {
                        this.endLayer = new this.DC.VectorLayer('endLayer')
                        this.endLayer = new global.DC.VectorLayer('endLayer')
                        this.viewer.addLayer(this.endLayer)
                    } else {
                        this.endLayer.clear()
                    }
                    // console.log("baoliuend", "see");
                    that.$store.commit('SET_STARTINGPOINT', [])
                    const endEntity = new that.DC.Billboard(
                        new that.DC.Position(
                    const endEntity = new global.DC.Billboard(
                        new global.DC.Position(
                            Number(this.terminus[0]),
                            Number(this.terminus[1]),
                            Number(this.terminus[2])
@@ -182,15 +180,15 @@
                } else if (val == 'end') {
                    // 初始化图标图层
                    if (this.startLayer == null) {
                        this.startLayer = new this.DC.VectorLayer('startLayer')
                        this.startLayer = new global.DC.VectorLayer('startLayer')
                        this.viewer.addLayer(this.startLayer)
                    } else {
                        this.startLayer.clear()
                    }
                    // console.log("baoliustart", "see");
                    that.$store.commit('SET_TERMINUS', [])
                    const startEntity = new that.DC.Billboard(
                        new that.DC.Position(
                    const startEntity = new global.DC.Billboard(
                        new global.DC.Position(
                            Number(this.startingPoint[0]),
                            Number(this.startingPoint[1]),
                            Number(this.startingPoint[2])
@@ -213,7 +211,7 @@
                title = '点击选择起点'
                // 初始化图标图层
                if (this.startLayer == null) {
                    this.startLayer = new this.DC.VectorLayer('startLayer')
                    this.startLayer = new global.DC.VectorLayer('startLayer')
                    this.viewer.addLayer(this.startLayer)
                } else {
                    this.startLayer.clear()
@@ -222,7 +220,7 @@
                title = '点击选择终点'
                // 初始化图标图层
                if (this.endLayer == null) {
                    this.endLayer = new this.DC.VectorLayer('endLayer')
                    this.endLayer = new global.DC.VectorLayer('endLayer')
                    this.viewer.addLayer(this.endLayer)
                } else {
                    this.endLayer.clear()
@@ -230,7 +228,7 @@
            }
            that.overChouse = false // 开启事件
            // 地图选点
            that.clicks = that.viewer.on(that.DC.MouseEventType.CLICK, (e) => {
            that.clicks = that.viewer.on(global.DC.MouseEventType.CLICK, (e) => {
                if (that.overChouse) {
                    return
                }
@@ -243,8 +241,8 @@
                    // 传输坐标数据
                    that.$store.commit('SET_STARTINGPOINT', [...lnglat, 0])
                    // 起点
                    const startEntity = new that.DC.Billboard(
                        new that.DC.Position(
                    const startEntity = new global.DC.Billboard(
                        new global.DC.Position(
                            Number(lnglat[0]),
                            Number(lnglat[1]),
                            Number(0)
@@ -257,8 +255,8 @@
                    // 传输坐标数据
                    that.$store.commit('SET_TERMINUS', [...lnglat, 0])
                    // 终点
                    const endEntity = new that.DC.Billboard(
                        new that.DC.Position(
                    const endEntity = new global.DC.Billboard(
                        new global.DC.Position(
                            Number(lnglat[0]),
                            Number(lnglat[1]),
                            Number(0)
@@ -273,7 +271,7 @@
                // 开启其他地图事件
                that.$store.commit('set_closeMapClick', false)
            })
            that.moves = that.viewer.on(that.DC.MouseEventType.MOUSE_MOVE, (e) => {
            that.moves = that.viewer.on(global.DC.MouseEventType.MOUSE_MOVE, (e) => {
                if (that.overChouse) {
                    return
                }
@@ -332,7 +330,7 @@
            }

            if (this.routeLayer == null) {
                this.routeLayer = new this.DC.VectorLayer('navigation')
                this.routeLayer = new global.DC.VectorLayer('navigation')
                this.viewer.addLayer(this.routeLayer)
            } else {
                this.routeLayer.clear()
@@ -344,9 +342,9 @@
                this.$message('请输入终点！！！')
            }

            // var start = this.DC.Transform.transformWGS84ToCartesian()
            const startEntity = new this.DC.Billboard(
                new this.DC.Position(
            // var start = global.DC.Transform.transformWGS84ToCartesian()
            const startEntity = new global.DC.Billboard(
                new global.DC.Position(
                    Number(this.startingPoint[0]),
                    Number(this.startingPoint[1]),
                    Number(this.startingPoint[2])
@@ -354,9 +352,9 @@
                '/img/navicon/start.png'
            )
            this.routeLayer.addOverlay(startEntity)
            // var end = this.DC.Transform.transformWGS84ToCartesian()
            const endEntity = new this.DC.Billboard(
                new this.DC.Position(
            // var end = global.DC.Transform.transformWGS84ToCartesian()
            const endEntity = new global.DC.Billboard(
                new global.DC.Position(
                    Number(this.terminus[0]),
                    Number(this.terminus[1]),
                    Number(this.terminus[2])
@@ -372,8 +370,8 @@
            var endLog = Number(this.terminus[0]).toFixed(6)
            var endLat = Number(this.terminus[1]).toFixed(6)

            var origin = this.DC.CoordTransform.WGS84ToGCJ02(startLog, startLat)
            var destination = this.DC.CoordTransform.WGS84ToGCJ02(endLog, endLat)
            var origin = global.DC.CoordTransform.WGS84ToGCJ02(startLog, startLat)
            var destination = global.DC.CoordTransform.WGS84ToGCJ02(endLog, endLat)

            if (this.navigationWay == '步行') {
                axios
@@ -407,7 +405,7 @@
                            item.polyline.forEach((it) => {
                                it = it.split(',')
                                lineArr.push(
                                    this.DC.CoordTransform.GCJ02ToWGS84(it[0], it[1]).join(',')
                                    global.DC.CoordTransform.GCJ02ToWGS84(it[0], it[1]).join(',')
                                )
                            })

@@ -423,11 +421,11 @@
                        routes =
                            startLog + ',' + startLat + ';' + routes + endLog + ',' + endLat

                        const polyline = new this.DC.Polyline(routes)
                        const polyline = new global.DC.Polyline(routes)
                        polyline.setStyle({
                            width: 3,
                            material: new this.DC.PolylineTrailMaterialProperty({
                                color: this.DC.Color.RED,
                            material: new global.DC.PolylineTrailMaterialProperty({
                                color: global.DC.Color.RED,
                                speed: 10
                            }),
                            clampToGround: true
@@ -456,16 +454,16 @@
                            this.viewer.camera.setView({
                                // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
                                // fromDegrees()方法，将经纬度和高程转换为世界坐标
                                destination: this.DC.Namespace.Cesium.Cartesian3.fromDegrees(
                                destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
                                    longitude,
                                    latitude,
                                    600
                                ),
                                orientation: {
                                    // 指向
                                    heading: this.DC.Namespace.Cesium.Math.toRadians(0, 0),
                                    heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
                                    // 视角
                                    pitch: this.DC.Namespace.Cesium.Math.toRadians(-90),
                                    pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
                                    roll: 0.0
                                }
                            })
@@ -493,7 +491,7 @@
                            item.polyline.forEach((it) => {
                                it = it.split(',')
                                lineArr.push(
                                    this.DC.CoordTransform.GCJ02ToWGS84(it[0], it[1]).join(',')
                                    global.DC.CoordTransform.GCJ02ToWGS84(it[0], it[1]).join(',')
                                )
                            })

@@ -507,11 +505,11 @@
                        routes =
                            startLog + ',' + startLat + ';' + routes + endLog + ',' + endLat

                        const polyline = new this.DC.Polyline(routes)
                        const polyline = new global.DC.Polyline(routes)
                        polyline.setStyle({
                            width: 3,
                            material: new this.DC.PolylineTrailMaterialProperty({
                                color: this.DC.Color.RED,
                            material: new global.DC.PolylineTrailMaterialProperty({
                                color: global.DC.Color.RED,
                                speed: 10
                            }),
                            clampToGround: true
@@ -541,16 +539,16 @@
                            this.viewer.camera.setView({
                                // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
                                // fromDegrees()方法，将经纬度和高程转换为世界坐标
                                destination: this.DC.Namespace.Cesium.Cartesian3.fromDegrees(
                                destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
                                    longitude,
                                    latitude,
                                    600
                                ),
                                orientation: {
                                    // 指向
                                    heading: this.DC.Namespace.Cesium.Math.toRadians(0, 0),
                                    heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
                                    // 视角
                                    pitch: this.DC.Namespace.Cesium.Math.toRadians(-90),
                                    pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
                                    roll: 0.0
                                }
                            })

 src/components/leftNav/index.vue

@@ -100,7 +100,6 @@
                }
            ],
            viewer: null,
            DC: null,
            tagLayer: null,
            wayLayer: null,
            sceneLayer: null,
@@ -112,7 +111,6 @@
        }
    },
    created () {
        this.DC = global.DC
    },
    mounted () {
        // 初始化新增标签图层
@@ -133,8 +131,8 @@
            }
            getTagList().then((res) => {
                res.data.data.forEach((item) => {
                    const divIcon = new this.DC.DivIcon(
                        new that.DC.Position(Number(item.jd), Number(item.wd), 0),
                    const divIcon = new global.DC.DivIcon(
                        new global.DC.Position(Number(item.jd), Number(item.wd), 0),
                        `
                        <div class="tag-entitys-box">
                            <div class="tag-content">
@@ -188,7 +186,7 @@
            for (let i = 0; i < num; i++) {
                const lng = 115.86271917 + Math.random() * 0.01
                const lat = 28.73615593 + Math.random() * 0.02
                list.push(new this.DC.Position(lng, lat, 0))
                list.push(new global.DC.Position(lng, lat, 0))
            }
            return list
        },
@@ -206,25 +204,25 @@
            var that = this
            viewer.scene.globe.depthTestAgainstTerrain = false
            this.viewer = viewer
            this.tagLayer = new this.DC.HtmlLayer('tagLayer')
            this.tagLayer = new global.DC.HtmlLayer('tagLayer')
            viewer.addLayer(this.tagLayer)
            this.wayLayer = new this.DC.HtmlLayer('wayLayer')
            this.wayLayer = new global.DC.HtmlLayer('wayLayer')
            viewer.addLayer(this.wayLayer)
            this.sceneLayer = new this.DC.HtmlLayer('sceneLayer')
            this.sceneLayer = new global.DC.HtmlLayer('sceneLayer')
            viewer.addLayer(this.sceneLayer)
            this.monitorLayer = new this.DC.HtmlLayer('monitorLayer')
            this.monitorLayer = new global.DC.HtmlLayer('monitorLayer')
            viewer.addLayer(this.monitorLayer)
            this.aedLayer = new this.DC.VectorLayer('aedLayer')
            this.aedLayer = new global.DC.VectorLayer('aedLayer')
            viewer.addLayer(this.aedLayer)
            this.parkLayer = new this.DC.HtmlLayer('parkLayer')
            this.parkLayer = new global.DC.HtmlLayer('parkLayer')
            viewer.addLayer(this.parkLayer)
            this.comeLayer = new this.DC.VectorLayer('comeLayer')
            this.comeLayer = new global.DC.VectorLayer('comeLayer')
            viewer.addLayer(this.comeLayer)

            getTagList().then((res) => {
                res.data.data.forEach((item) => {
                    const divIcon = new this.DC.DivIcon(
                        new that.DC.Position(Number(item.jd), Number(item.wd), 0),
                    const divIcon = new global.DC.DivIcon(
                        new global.DC.Position(Number(item.jd), Number(item.wd), 0),
                        `
                        <div class="tag-entitys-box">
                            <div class="tag-content">
@@ -255,8 +253,8 @@

            getWayList().then((res) => {
                res.data.data.forEach((item) => {
                    const divIcon = new this.DC.DivIcon(
                        new that.DC.Position(Number(item.jd), Number(item.wd), 0),
                    const divIcon = new global.DC.DivIcon(
                        new global.DC.Position(Number(item.jd), Number(item.wd), 0),
                        `
                        <div  class="way-entitys-box">
                            <div  class="way-title" style="border: white 1px solid; font-size: 0.875rem; background: #0066ff;  width: 18px; line-height: 14px; padding: 6px 2px 6px 2px; color: white; text-align: center;">
@@ -275,8 +273,8 @@

            getMonitorList().then((res) => {
                res.data.data.records.forEach((item) => {
                    const divIcon = new this.DC.DivIcon(
                        new that.DC.Position(Number(item.jd), Number(item.wd), 0),
                    const divIcon = new global.DC.DivIcon(
                        new global.DC.Position(Number(item.jd), Number(item.wd), 0),
                        `
                        <div class="monitor-entitys-box">
                            <div>${item.vrname}</div>
@@ -287,7 +285,7 @@
                    divIcon.attrParams = item
                    this.monitorLayer.addOverlay(divIcon)

                    divIcon.on(that.DC.MouseEventType.CLICK, (e) => {
                    divIcon.on(global.DC.MouseEventType.CLICK, (e) => {
                        that.viewer.flyToPosition(
                            new global.DC.Position(Number(item.jd), Number(item.wd), Number(300), Number(0), Number(-90), Number(0)),
                            function () { },
@@ -302,9 +300,9 @@
                        )
                        this.$store.commit('SET_MONITORURL', e.overlay.attrParams.vrurl)
                        // eslint-disable-next-line new-cap
                        var positions = this.DC.Transform.transformWGS84ToCartesian(
                        var positions = global.DC.Transform.transformWGS84ToCartesian(
                            // eslint-disable-next-line new-cap
                            new this.DC.Position.fromArray([
                            new global.DC.Position.fromArray([
                                Number(item.jd),
                                Number(item.wd),
                                0,
@@ -315,7 +313,7 @@
                        )
                        this.viewer.scene.globe.depthTestAgainstTerrain = false
                        // eslint-disable-next-line no-unused-vars
                        var monitor = new this.DC.PanoramaBox(this.viewer, {
                        var monitor = new global.DC.PanoramaBox(this.viewer, {
                            domId: 'MonitorBox',
                            position: [positions]
                        })
@@ -329,8 +327,8 @@

            getSceneList().then((res) => {
                res.data.data.records.forEach((item) => {
                    const divIcon = new this.DC.DivIcon(
                        new that.DC.Position(Number(item.jd), Number(item.wd), 0),
                    const divIcon = new global.DC.DivIcon(
                        new global.DC.Position(Number(item.jd), Number(item.wd), 0),
                        `
                        <div class="scene-entitys-box">
                            <div>${item.vrname}</div>
@@ -341,7 +339,7 @@
                    divIcon.attrParams = item
                    this.sceneLayer.addOverlay(divIcon)

                    divIcon.on(that.DC.MouseEventType.CLICK, (e) => {
                    divIcon.on(global.DC.MouseEventType.CLICK, (e) => {
                        that.viewer.flyToPosition(
                            new global.DC.Position(Number(item.jd), Number(item.wd), Number(300), Number(0), Number(-90), Number(0)),
                            function () { },
@@ -359,9 +357,9 @@
                            e.overlay.attrParams.vrurl
                        )
                        // eslint-disable-next-line new-cap
                        var positions = that.DC.Transform.transformWGS84ToCartesian(
                        var positions = global.DC.Transform.transformWGS84ToCartesian(
                            // eslint-disable-next-line new-cap
                            new that.DC.Position.fromArray([
                            new global.DC.Position.fromArray([
                                Number(item.jd),
                                Number(item.wd),
                                0,
@@ -372,7 +370,7 @@
                        )
                        this.viewer.scene.globe.depthTestAgainstTerrain = false
                        // eslint-disable-next-line no-unused-vars
                        var panorama = new this.DC.PanoramaBox(this.viewer, {
                        var panorama = new global.DC.PanoramaBox(this.viewer, {
                            domId: 'PanoramaBox',
                            position: [positions]
                        })
@@ -386,22 +384,22 @@

            getLifeList({ lifetype: 9 }).then((res) => {
                res.data.data.forEach((item) => {
                    const label = new this.DC.Label(
                        new that.DC.Position(Number(item.jd), Number(item.wd), 0),
                    const label = new global.DC.Label(
                        new global.DC.Position(Number(item.jd), Number(item.wd), 0),
                        item.mechanismname
                    )
                    label.setStyle({
                        fillColor: this.DC.Color.CRIMSON,
                        style: that.DC.Namespace.Cesium.LabelStyle.FILL_AND_OUTLINE,
                        outlineColor: that.DC.Color.WHITE, // 边框颜色
                        fillColor: global.DC.Color.CRIMSON,
                        style: global.DC.Namespace.Cesium.LabelStyle.FILL_AND_OUTLINE,
                        outlineColor: global.DC.Color.WHITE, // 边框颜色
                        outlineWidth: 8, // 边框大小，
                        font: '14px sans-serif',
                        pixelOffset: { x: 0, y: -24 }
                    })
                    this.aedLayer.addOverlay(label)

                    const billboard = new this.DC.Billboard(
                        new that.DC.Position(Number(item.jd), Number(item.wd), 0),
                    const billboard = new global.DC.Billboard(
                        new global.DC.Position(Number(item.jd), Number(item.wd), 0),
                        '/img/leftnav/map-aed.png'
                    )
                    billboard.size = [20, 20]
@@ -413,8 +411,8 @@

            getLifeList({ lifetype: 11 }).then((res) => {
                res.data.data.forEach((item) => {
                    const divIcon = new this.DC.DivIcon(
                        new that.DC.Position(Number(item.jd), Number(item.wd), 0),
                    const divIcon = new global.DC.DivIcon(
                        new global.DC.Position(Number(item.jd), Number(item.wd), 0),
                        `
                        <div class="park-entitys-box">
                            <div class="park-title" alt="${item.mechanismname}">
@@ -437,22 +435,22 @@

            getLifeList({ lifetype: 12 }).then((res) => {
                res.data.data.forEach((item) => {
                    const label = new that.DC.Label(
                        new that.DC.Position(Number(item.jd), Number(item.wd), 0),
                    const label = new global.DC.Label(
                        new global.DC.Position(Number(item.jd), Number(item.wd), 0),
                        item.mechanismname
                    )
                    label.setStyle({
                        fillColor: that.DC.Color.FUCHSIA,
                        style: that.DC.Namespace.Cesium.LabelStyle.FILL_AND_OUTLINE,
                        outlineColor: that.DC.Color.WHITE, // 边框颜色
                        fillColor: global.DC.Color.FUCHSIA,
                        style: global.DC.Namespace.Cesium.LabelStyle.FILL_AND_OUTLINE,
                        outlineColor: global.DC.Color.WHITE, // 边框颜色
                        outlineWidth: 8, // 边框大小，
                        font: '14px sans-serif',
                        pixelOffset: { x: 0, y: -40 }
                    })
                    that.comeLayer.addOverlay(label)

                    const billboard = new that.DC.Billboard(
                        new that.DC.Position(Number(item.jd), Number(item.wd), 0),
                    const billboard = new global.DC.Billboard(
                        new global.DC.Position(Number(item.jd), Number(item.wd), 0),
                        '/img/leftnav/map-activity.png'
                    )
                    billboard.size = [20, 20]
@@ -466,11 +464,11 @@
            })
        },
        openPopups (value) {
            var popup = new this.DC.DivForms(this.viewer, {
            var popup = new global.DC.DivForms(this.viewer, {
                domId: 'divFormsDomBox',
                position: [
                    this.DC.Transform.transformWGS84ToCartesian(
                        new this.DC.Position(
                    global.DC.Transform.transformWGS84ToCartesian(
                        new global.DC.Position(
                            Number(value.lng),
                            Number(value.lat),
                            Number(value.alt || 0)

 src/components/map/components/campusBuildingSearch copy.vue

@@ -47,7 +47,6 @@
    name: 'campusBuildingSearch',
    data () {
        return {
            DC: null,
            shortcutList: [
                // {
                //     bgimg: '/img/search/org.png',
@@ -108,7 +107,6 @@
        ])
    },
    created () {
        this.DC = global.DC
    },
    methods: {
        searchValueChange () {
@@ -263,7 +261,7 @@

            this.newPopup(result)
            this.viewer.flyToPosition(
                new this.DC.Position(
                new global.DC.Position(
                    Number(result.jd),
                    Number(result.wd),
                    300,
@@ -277,11 +275,11 @@
        },

        newPopup (item) {
            const position = this.DC.Transform.transformWGS84ToCartesian(
                new this.DC.Position(Number(item.jd), Number(item.wd), Number(item.gd))
            const position = global.DC.Transform.transformWGS84ToCartesian(
                new global.DC.Position(Number(item.jd), Number(item.wd), Number(item.gd))
            )
            // eslint-disable-next-line no-unused-vars
            var popup = new this.DC.DivForms(this.viewer, {
            var popup = new global.DC.DivForms(this.viewer, {
                domId: 'divFormsDomBox',
                position: [position]
            })

 src/components/map/components/campusBuildingSearch.vue

@@ -52,7 +52,6 @@
    name: 'campusBuildingSearch',
    data () {
        return {
            DC: null,
            shortcutList: [
                {
                    bgimg: '/img/search/org.png',
@@ -121,7 +120,6 @@
        ])
    },
    created () {
        this.DC = global.DC
    },
    methods: {
        searchValueChange () {
@@ -265,7 +263,7 @@

            this.newPopup(param)
            this.viewer.flyToPosition(
                new this.DC.Position(
                new global.DC.Position(
                    Number(param.jd),
                    Number(param.wd),
                    300,
@@ -279,11 +277,11 @@
        },

        newPopup (item) {
            const position = this.DC.Transform.transformWGS84ToCartesian(
                new this.DC.Position(Number(item.jd), Number(item.wd), Number(item.gd))
            const position = global.DC.Transform.transformWGS84ToCartesian(
                new global.DC.Position(Number(item.jd), Number(item.wd), Number(item.gd))
            )
            // eslint-disable-next-line no-unused-vars
            var popup = new this.DC.DivForms(this.viewer, {
            var popup = new global.DC.DivForms(this.viewer, {
                domId: 'divFormsDomBox',
                position: [position]
            })

 src/components/map/components/dimension.vue

@@ -16,15 +16,10 @@
    name: 'dimension',
    data () {
        return {
            DC: null,
            dimensionValue: '三 维',
            // 建筑2.5D地图
            newLayer: null,
            baseLayer: null,
            // 电子地图
            vecLayer: null,
            // 标注
            cvaLayer: null,
            // 建筑2.5D面数据
            provider: null,
            wallLayer: null,
@@ -77,7 +72,6 @@
        ])
    },
    created () {
        this.DC = global.DC
    },
    watch: {
        viewer: {
@@ -86,70 +80,90 @@
                if (this.titlesetLayerFlag == false && newCode != null) {
                    var that = this

                    that.tilesetLayer = new that.DC.TilesetLayer('tilesetLayer')
                    that.tilesetLayer = new global.DC.TilesetLayer('tilesetLayer')
                    that.viewer.addLayer(that.tilesetLayer)
                    that.tileset = new that.DC.Tileset('/mx/tileset.json', {
                    that.tileset = new global.DC.Tileset('/mx/tileset.json', {
                        luminanceAtZenith: 0.3,
                        shadows: that.DC.Namespace.Cesium.ShadowMode.DISABLED
                        shadows: global.DC.Namespace.Cesium.ShadowMode.DISABLED
                    })
                    that.tilesetLayer.addOverlay(that.tileset)
                    that.tilesetLayer.show = false

                    that.silhouetteBlue =
                        that.DC.Namespace.Cesium.PostProcessStageLibrary.createEdgeDetectionStage()
                        global.DC.Namespace.Cesium.PostProcessStageLibrary.createEdgeDetectionStage()
                    that.silhouetteBlue.uniforms.color =
                        that.DC.Namespace.Cesium.Color.fromBytes(9, 162, 40)
                        global.DC.Namespace.Cesium.Color.fromBytes(9, 162, 40)
                    that.silhouetteBlue.uniforms.length = 0.01
                    that.silhouetteBlue.selected = []

                    that.viewer.scene.postProcessStages.add(
                        that.DC.Namespace.Cesium.PostProcessStageLibrary.createSilhouetteStage(
                        global.DC.Namespace.Cesium.PostProcessStageLibrary.createSilhouetteStage(
                            [that.silhouetteBlue]
                        )
                    )

                    that.vecLayer = that.viewer.imageryLayers.addImageryProvider(
                        new that.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
                            url: ' http://t1.tianditu.gov.cn/vec_w/wmts?tk=9ae78c51a0a28f06444d541148496e36',
                            type: 'wmts',
                            layer: 'vec',
                            style: 'default',
                            format: 'tiles',
                            tileMatrixSetID: 'w',
                    that.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=9ae78c51a0a28f06444d541148496e36',
                            subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'],
                            format: 'image/jpeg',
                            show: true,
                            maximumLevel: 18
                        })
                    )

                    that.cvaLayer = that.viewer.imageryLayers.addImageryProvider(
                        new that.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
                            url: ' http://t1.tianditu.gov.cn/cva_w/wmts?tk=9ae78c51a0a28f06444d541148496e36',
                            type: 'wmts',
                            layer: 'cva',
                            style: 'default',
                            format: 'tiles',
                            tileMatrixSetID: 'w',
                    that.viewer.imageryLayers.addImageryProvider(
                        new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({
                            url: 'http://t{s}.tianditu.gov.cn/DataServer?T=cva_w&x={x}&y={y}&l={z}&tk=9ae78c51a0a28f06444d541148496e36',
                            subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'],
                            format: 'image/jpeg',
                            show: true,
                            maximumLevel: 18
                        })
                    )

                    // that.viewer.imageryLayers.addImageryProvider(
                    //     new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
                    //         url: ' http://t1.tianditu.gov.cn/vec_w/wmts?tk=9ae78c51a0a28f06444d541148496e36',
                    //         type: 'wmts',
                    //         layer: 'vec',
                    //         style: 'default',
                    //         format: 'tiles',
                    //         tileMatrixSetID: 'w',
                    //         show: true,
                    //         maximumLevel: 18
                    //     })
                    // )

                    // that.viewer.imageryLayers.addImageryProvider(
                    //     new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
                    //         url: ' http://t1.tianditu.gov.cn/cva_w/wmts?tk=9ae78c51a0a28f06444d541148496e36',
                    //         type: 'wmts',
                    //         layer: 'cva',
                    //         style: 'default',
                    //         format: 'tiles',
                    //         tileMatrixSetID: 'w',
                    //         show: true,
                    //         maximumLevel: 18
                    //     })
                    // )

                    var highlighted = {
                        feature: undefined,
                        originalColor: new that.DC.Namespace.Cesium.Color()
                        originalColor: new global.DC.Namespace.Cesium.Color()
                    }

                    var selected = {
                        feature: undefined,
                        originalColor: new that.DC.Namespace.Cesium.Color()
                        originalColor: new global.DC.Namespace.Cesium.Color()
                    }

                    const videoLayer = new that.DC.CameraVideoLayer('video-layer').addTo(
                    const videoLayer = new global.DC.CameraVideoLayer('video-layer').addTo(
                        that.viewer
                    )

                    const cameraVideo = new that.DC.CameraVideo(
                        new that.DC.Position(114.03935976, 27.62939045, 100.25, 4.2, -90),
                    const cameraVideo = new global.DC.CameraVideo(
                        new global.DC.Position(114.03935976, 27.62939045, 100.25, 4.2, -90),
                        document.getElementById('video')
                    )
                    cameraVideo.setStyle({
@@ -161,7 +175,7 @@
                    })
                    videoLayer.addOverlay(cameraVideo)

                    that.tileset.on(that.DC.MouseEventType.CLICK, (e) => {
                    that.tileset.on(global.DC.MouseEventType.CLICK, (e) => {
                        if (that.closeMapClick) {
                            return
                        }
@@ -211,11 +225,11 @@

                                    // 定制化窗体
                                    // eslint-disable-next-line no-unused-vars
                                    var popup = new that.DC.DivForms(that.viewer, {
                                    var popup = new global.DC.DivForms(that.viewer, {
                                        domId: 'divFormsDomBox',
                                        position: [
                                            that.DC.Transform.transformWGS84ToCartesian(
                                                new that.DC.Position(
                                            global.DC.Transform.transformWGS84ToCartesian(
                                                new global.DC.Position(
                                                    Number(e.wgs84Position.lng),
                                                    Number(e.wgs84Position.lat),
                                                    Number(e.wgs84Position.alt)
@@ -231,7 +245,7 @@
                            })

                            this.viewer.flyToPosition(
                                new this.DC.Position(
                                new global.DC.Position(
                                    Number(e.wgs84Position.lng + 0.00070806),
                                    Number(e.wgs84Position.lat - 0.00261205),
                                    300,
@@ -243,10 +257,10 @@
                        }
                    })

                    // that.tileset.on(that.DC.MouseEventType.MOUSE_MOVE, e => {
                    // that.tileset.on(global.DC.MouseEventType.MOUSE_MOVE, e => {
                    //     that.silhouetteBlue.selected = []

                    //     if (that.DC.Namespace.Cesium.defined(highlighted.feature)) {
                    //     if (global.DC.Namespace.Cesium.defined(highlighted.feature)) {
                    //         highlighted.feature.color = highlighted.originalColor
                    //         highlighted.feature = undefined
                    //     }
@@ -256,21 +270,21 @@

                    //         highlighted.feature = e.feature

                    //         that.DC.Namespace.Cesium.Color.clone(
                    //         global.DC.Namespace.Cesium.Color.clone(
                    //             e.feature.color,
                    //             highlighted.originalColor
                    //         )
                    //         e.feature.color = that.DC.Namespace.Cesium.Color.fromBytes(155, 255, 175)
                    //         e.feature.color = global.DC.Namespace.Cesium.Color.fromBytes(155, 255, 175)
                    //     }
                    // })

                    // var provider = new that.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
                    // var provider = new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
                    //     url: 'http://www.tdtfz.com/OneMapServer/rest/services/fzsw2019/MapServer/WMTS/tile/1.0.0/fzsw2019/{Style}/{TileMatrixSet}/{TileMatrix}/{TileRow}/{TileCol}',
                    //     layer: 'fzsw2019',
                    //     style: 'default',
                    //     tileMatrixSetID: 'default028mm',
                    //     format: 'image/jpgpng',
                    //     tilingScheme: new that.DC.Namespace.Cesium.GeographicTilingScheme(),
                    //     tilingScheme: new global.DC.Namespace.Cesium.GeographicTilingScheme(),
                    //     maximumLevel: 19,
                    //     tileMatrixLabels: [
                    //         '0',
@@ -297,14 +311,14 @@
                    // })

                    var provider =
                        new that.DC.Namespace.Cesium.UrlTemplateImageryProvider({
                        new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({
                            url: '/wp/{z}/{x}/{y}.png',
                            fileExtension: 'png'
                            // minimumLevel: 19
                        })

                    var baseProvider =
                        new that.DC.Namespace.Cesium.UrlTemplateImageryProvider({
                        new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({
                            url: '/base/{z}/{x}/{y}.png',
                            fileExtension: 'png'
                        })
@@ -313,18 +327,18 @@
                    that.newLayer =
                        that.viewer.imageryLayers.addImageryProvider(provider)

                    that.wallLayer = new that.DC.VectorLayer('wallLayer')
                    that.wallLayer = new global.DC.VectorLayer('wallLayer')
                    // that.viewer.addLayer(that.wallLayer)

                    that.wallArr.forEach((item) => {
                        item = item.join(',')
                    })
                    that.wallArr = that.wallArr.join(';')
                    const wall = new that.DC.Wall(that.wallArr)
                    const wall = new global.DC.Wall(that.wallArr)
                    wall.setStyle({
                        material: new that.DC.WallTrailMaterialProperty({
                            color: that.DC.Namespace.Cesium.Color.fromBytes(0, 142, 255, 150),
                            // color: that.DC.Color.CYAN,
                        material: new global.DC.WallTrailMaterialProperty({
                            color: global.DC.Namespace.Cesium.Color.fromBytes(0, 142, 255, 150),
                            // color: global.DC.Color.CYAN,
                            speed: 10
                        })
                    })
@@ -333,12 +347,12 @@
                    // that.viewer.camera.setView({
                    //     // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
                    //     // fromDegrees()方法，将经纬度和高程转换为世界坐标
                    //     destination: that.DC.Namespace.Cesium.Cartesian3.fromDegrees(114.03928791, 27.62954732, 400.0),
                    //     destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(114.03928791, 27.62954732, 400.0),
                    //     orientation: {
                    //         // 指向
                    //         heading: that.DC.Namespace.Cesium.Math.toRadians(0, 0),
                    //         heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
                    //         // 视角
                    //         pitch: that.DC.Namespace.Cesium.Math.toRadians(-90),
                    //         pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
                    //         roll: 0.0
                    //     }
                    // })
@@ -347,18 +361,18 @@
                    //     that.viewer.camera.flyTo({
                    //         // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
                    //         // fromDegrees()方法，将经纬度和高程转换为世界坐标
                    //         destination: that.DC.Namespace.Cesium.Cartesian3.fromDegrees(114.0351, 27.6314, 200.0),
                    //         destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(114.0351, 27.6314, 200.0),
                    //         duration: 5,
                    //         complete: () => {
                    //             that.viewer.camera.flyTo({
                    //                 // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
                    //                 // fromDegrees()方法，将经纬度和高程转换为世界坐标
                    //                 destination: that.DC.Namespace.Cesium.Cartesian3.fromDegrees(114.0351, 27.6314, 200.0),
                    //                 destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(114.0351, 27.6314, 200.0),
                    //                 orientation: {
                    //                     // 指向
                    //                     heading: that.DC.Namespace.Cesium.Math.toRadians(108),
                    //                     heading: global.DC.Namespace.Cesium.Math.toRadians(108),
                    //                     // 视角
                    //                     pitch: that.DC.Namespace.Cesium.Math.toRadians(-26.46),
                    //                     pitch: global.DC.Namespace.Cesium.Math.toRadians(-26.46),
                    //                     roll: 0.0
                    //                 }
                    //             })
@@ -370,16 +384,16 @@
                    that.viewer.camera.setView({
                        // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
                        // fromDegrees()方法，将经纬度和高程转换为世界坐标
                        destination: that.DC.Namespace.Cesium.Cartesian3.fromDegrees(
                        destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
                            that.mapCenter[0],
                            that.mapCenter[1],
                            that.mapCenter[2]
                        ),
                        orientation: {
                            // 指向
                            heading: that.DC.Namespace.Cesium.Math.toRadians(0, 0),
                            heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
                            // 视角
                            pitch: that.DC.Namespace.Cesium.Math.toRadians(-90),
                            pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
                            roll: 0.0
                        }
                    })
@@ -412,11 +426,11 @@

                                item.geometry.rings[0] = item.geometry.rings[0].join(';')

                                const polygon = new that.DC.Polygon(item.geometry.rings[0])
                                const polygon = new global.DC.Polygon(item.geometry.rings[0])
                                polygon.attr = item.attributes

                                polygon.setStyle({
                                    material: that.DC.Namespace.Cesium.Color.fromBytes(
                                    material: global.DC.Namespace.Cesium.Color.fromBytes(
                                        255,
                                        255,
                                        255,
@@ -435,7 +449,7 @@
                        color: undefined
                    }

                    that.viewer.on(that.DC.MouseEventType.MOUSE_MOVE, (e) => {
                    that.viewer.on(global.DC.MouseEventType.MOUSE_MOVE, (e) => {
                        if (that.closeMapClick) {
                            return
                        }
@@ -458,7 +472,7 @@
                                select.color = e.overlay._style.material
                                select.overlay.setStyle({
                                    outline: true,
                                    outlineColor: that.DC.Namespace.Cesium.Color.fromBytes(
                                    outlineColor: global.DC.Namespace.Cesium.Color.fromBytes(
                                        3,
                                        255,
                                        13,
@@ -466,7 +480,7 @@
                                    ), // 边框颜色
                                    outlineWidth: 10, // 边框大小，
                                    height: 0.01,
                                    material: that.DC.Namespace.Cesium.Color.fromBytes(
                                    material: global.DC.Namespace.Cesium.Color.fromBytes(
                                        108,
                                        245,
                                        113,
@@ -487,7 +501,7 @@
                        }
                    })

                    that.viewer.on(that.DC.MouseEventType.CLICK, (e) => {
                    that.viewer.on(global.DC.MouseEventType.CLICK, (e) => {
                        if (that.closeMapClick) {
                            return
                        }
@@ -539,11 +553,11 @@

                                // 定制化窗体
                                // eslint-disable-next-line no-unused-vars
                                var popup = new that.DC.DivForms(that.viewer, {
                                var popup = new global.DC.DivForms(that.viewer, {
                                    domId: 'divFormsDomBox',
                                    position: [
                                        that.DC.Transform.transformWGS84ToCartesian(
                                            new that.DC.Position(
                                        global.DC.Transform.transformWGS84ToCartesian(
                                            new global.DC.Position(
                                                Number(e.wgs84Position.lng),
                                                Number(e.wgs84Position.lat),
                                                Number(e.wgs84Position.alt)
@@ -558,7 +572,7 @@
                            })

                            this.viewer.flyToPosition(
                                new this.DC.Position(
                                new global.DC.Position(
                                    Number(e.wgs84Position.lng),
                                    Number(e.wgs84Position.lat),
                                    300,
@@ -578,16 +592,16 @@
                                that.viewer.camera.setView({
                                    // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
                                    // fromDegrees()方法，将经纬度和高程转换为世界坐标
                                    destination: that.DC.Namespace.Cesium.Cartesian3.fromDegrees(
                                    destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
                                        that.mapCenter[0],
                                        that.mapCenter[1],
                                        220.0
                                    ),
                                    orientation: {
                                        // 指向
                                        heading: that.DC.Namespace.Cesium.Math.toRadians(-9),
                                        heading: global.DC.Namespace.Cesium.Math.toRadians(-9),
                                        // 视角
                                        pitch: that.DC.Namespace.Cesium.Math.toRadians(-34.54),
                                        pitch: global.DC.Namespace.Cesium.Math.toRadians(-34.54),
                                        roll: 0.0
                                    }
                                })
@@ -595,16 +609,16 @@
                                that.viewer.camera.setView({
                                    // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
                                    // fromDegrees()方法，将经纬度和高程转换为世界坐标
                                    destination: that.DC.Namespace.Cesium.Cartesian3.fromDegrees(
                                    destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
                                        that.mapCenter[0],
                                        that.mapCenter[1],
                                        400.0
                                    ),
                                    orientation: {
                                        // 指向
                                        heading: that.DC.Namespace.Cesium.Math.toRadians(0, 0),
                                        heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
                                        // 视角
                                        pitch: that.DC.Namespace.Cesium.Math.toRadians(-90),
                                        pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
                                        roll: 0.0
                                    }
                                })
@@ -624,16 +638,16 @@
                                if (height <= 250) {
                                    that.viewer.camera.setView({
                                        destination:
                                            that.DC.Namespace.Cesium.Cartesian3.fromRadians(
                                            global.DC.Namespace.Cesium.Cartesian3.fromRadians(
                                                that.viewer.camera.positionCartographic.longitude,
                                                that.viewer.camera.positionCartographic.latitude,
                                                280
                                            ),
                                        orientation: {
                                            // 指向
                                            heading: that.DC.Namespace.Cesium.Math.toRadians(0, 0),
                                            heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
                                            // 视角
                                            pitch: that.DC.Namespace.Cesium.Math.toRadians(-90),
                                            pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
                                            roll: 0.0
                                        }
                                    })
@@ -642,16 +656,16 @@
                                if (height > 250 && height <= 310) {
                                    that.viewer.camera.setView({
                                        destination:
                                            that.DC.Namespace.Cesium.Cartesian3.fromRadians(
                                            global.DC.Namespace.Cesium.Cartesian3.fromRadians(
                                                that.viewer.camera.positionCartographic.longitude,
                                                that.viewer.camera.positionCartographic.latitude,
                                                340
                                            ),
                                        orientation: {
                                            // 指向
                                            heading: that.DC.Namespace.Cesium.Math.toRadians(0, 0),
                                            heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
                                            // 视角
                                            pitch: that.DC.Namespace.Cesium.Math.toRadians(-90),
                                            pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
                                            roll: 0.0
                                        }
                                    })
@@ -660,16 +674,16 @@
                                if (height > 310 && height < 370) {
                                    that.viewer.camera.setView({
                                        destination:
                                            that.DC.Namespace.Cesium.Cartesian3.fromRadians(
                                            global.DC.Namespace.Cesium.Cartesian3.fromRadians(
                                                that.viewer.camera.positionCartographic.longitude,
                                                that.viewer.camera.positionCartographic.latitude,
                                                400
                                            ),
                                        orientation: {
                                            // 指向
                                            heading: that.DC.Namespace.Cesium.Math.toRadians(0, 0),
                                            heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
                                            // 视角
                                            pitch: that.DC.Namespace.Cesium.Math.toRadians(-90),
                                            pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
                                            roll: 0.0
                                        }
                                    })
@@ -690,16 +704,16 @@
                                if (height > 370) {
                                    that.viewer.camera.setView({
                                        destination:
                                            that.DC.Namespace.Cesium.Cartesian3.fromRadians(
                                            global.DC.Namespace.Cesium.Cartesian3.fromRadians(
                                                that.viewer.camera.positionCartographic.longitude,
                                                that.viewer.camera.positionCartographic.latitude,
                                                340
                                            ),
                                        orientation: {
                                            // 指向
                                            heading: that.DC.Namespace.Cesium.Math.toRadians(0, 0),
                                            heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
                                            // 视角
                                            pitch: that.DC.Namespace.Cesium.Math.toRadians(-90),
                                            pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
                                            roll: 0.0
                                        }
                                    })
@@ -710,16 +724,16 @@
                                if (height > 310) {
                                    that.viewer.camera.setView({
                                        destination:
                                            that.DC.Namespace.Cesium.Cartesian3.fromRadians(
                                            global.DC.Namespace.Cesium.Cartesian3.fromRadians(
                                                that.viewer.camera.positionCartographic.longitude,
                                                that.viewer.camera.positionCartographic.latitude,
                                                280
                                            ),
                                        orientation: {
                                            // 指向
                                            heading: that.DC.Namespace.Cesium.Math.toRadians(0, 0),
                                            heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
                                            // 视角
                                            pitch: that.DC.Namespace.Cesium.Math.toRadians(-90),
                                            pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
                                            roll: 0.0
                                        }
                                    })
@@ -730,16 +744,16 @@
                                if (height > 250) {
                                    that.viewer.camera.setView({
                                        destination:
                                            that.DC.Namespace.Cesium.Cartesian3.fromRadians(
                                            global.DC.Namespace.Cesium.Cartesian3.fromRadians(
                                                that.viewer.camera.positionCartographic.longitude,
                                                that.viewer.camera.positionCartographic.latitude,
                                                220
                                            ),
                                        orientation: {
                                            // 指向
                                            heading: that.DC.Namespace.Cesium.Math.toRadians(0, 0),
                                            heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
                                            // 视角
                                            pitch: that.DC.Namespace.Cesium.Math.toRadians(-90),
                                            pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
                                            roll: 0.0
                                        }
                                    })
@@ -747,7 +761,7 @@
                            }
                        }

                    that.viewer.on(that.DC.SceneEventType.CAMERA_CHANGED, () => {
                    that.viewer.on(global.DC.SceneEventType.CAMERA_CHANGED, () => {
                        if (
                            that.dimensionValue != undefined &&
                            that.dimensionValue != '真三维'
@@ -759,25 +773,25 @@
                            that.viewer.camera.setView({
                                orientation: {
                                    // 指向
                                    heading: that.DC.Namespace.Cesium.Math.toRadians(0, 0),
                                    heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
                                    // 视角
                                    pitch: that.DC.Namespace.Cesium.Math.toRadians(-90),
                                    pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
                                    roll: 0.0
                                }
                            })

                            if (height <= 250) {
                                that.viewer.camera.setView({
                                    destination: that.DC.Namespace.Cesium.Cartesian3.fromRadians(
                                    destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians(
                                        that.viewer.camera.positionCartographic.longitude,
                                        that.viewer.camera.positionCartographic.latitude,
                                        220
                                    ),
                                    orientation: {
                                        // 指向
                                        heading: that.DC.Namespace.Cesium.Math.toRadians(0, 0),
                                        heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
                                        // 视角
                                        pitch: that.DC.Namespace.Cesium.Math.toRadians(-90),
                                        pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
                                        roll: 0.0
                                    }
                                })
@@ -785,16 +799,16 @@

                            if (height > 250 && height <= 310) {
                                that.viewer.camera.setView({
                                    destination: that.DC.Namespace.Cesium.Cartesian3.fromRadians(
                                    destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians(
                                        that.viewer.camera.positionCartographic.longitude,
                                        that.viewer.camera.positionCartographic.latitude,
                                        280
                                    ),
                                    orientation: {
                                        // 指向
                                        heading: that.DC.Namespace.Cesium.Math.toRadians(0, 0),
                                        heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
                                        // 视角
                                        pitch: that.DC.Namespace.Cesium.Math.toRadians(-90),
                                        pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
                                        roll: 0.0
                                    }
                                })
@@ -802,16 +816,16 @@

                            if (height > 310 && height <= 370) {
                                that.viewer.camera.setView({
                                    destination: that.DC.Namespace.Cesium.Cartesian3.fromRadians(
                                    destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians(
                                        that.viewer.camera.positionCartographic.longitude,
                                        that.viewer.camera.positionCartographic.latitude,
                                        340
                                    ),
                                    orientation: {
                                        // 指向
                                        heading: that.DC.Namespace.Cesium.Math.toRadians(0, 0),
                                        heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
                                        // 视角
                                        pitch: that.DC.Namespace.Cesium.Math.toRadians(-90),
                                        pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
                                        roll: 0.0
                                    }
                                })
@@ -819,16 +833,16 @@

                            if (height > 370) {
                                that.viewer.camera.setView({
                                    destination: that.DC.Namespace.Cesium.Cartesian3.fromRadians(
                                    destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians(
                                        that.viewer.camera.positionCartographic.longitude,
                                        that.viewer.camera.positionCartographic.latitude,
                                        400
                                    ),
                                    orientation: {
                                        // 指向
                                        heading: that.DC.Namespace.Cesium.Math.toRadians(0, 0),
                                        heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
                                        // 视角
                                        pitch: that.DC.Namespace.Cesium.Math.toRadians(-90),
                                        pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
                                        roll: 0.0
                                    }
                                })
@@ -841,11 +855,11 @@
    },
    methods: {
        // openPopups(lng, lat, alt) {
        //   var popup = new that.DC.DivForms(that.viewer, {
        //   var popup = new global.DC.DivForms(that.viewer, {
        //     domId: "divFormsDomBox",
        //     position: [
        //       that.DC.Transform.transformWGS84ToCartesian(
        //         new that.DC.Position(Number(lng), Number(lat), Number(alt))
        //       global.DC.Transform.transformWGS84ToCartesian(
        //         new global.DC.Position(Number(lng), Number(lat), Number(alt))
        //       ),
        //     ],
        //   });
@@ -860,27 +874,7 @@
                that.newLayer = null
                // that.viewer.imageryLayers.remove(that.baseLayer)
                that.baseLayer = null
                // that.vecLayer = that.viewer.imageryLayers.addImageryProvider(new that.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
                //     url: ' http://t1.tianditu.gov.cn/vec_w/wmts?tk=9ae78c51a0a28f06444d541148496e36',
                //     type: 'wmts',
                //     layer: 'vec',
                //     style: 'default',
                //     format: 'tiles',
                //     tileMatrixSetID: 'w',
                //     show: true,
                //     maximumLevel: 18
                // }))

                // that.cvaLayer = that.viewer.imageryLayers.addImageryProvider(new that.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
                //     url: ' http://t1.tianditu.gov.cn/cva_w/wmts?tk=9ae78c51a0a28f06444d541148496e36',
                //     type: 'wmts',
                //     layer: 'cva',
                //     style: 'default',
                //     format: 'tiles',
                //     tileMatrixSetID: 'w',
                //     show: true,
                //     maximumLevel: 18
                // }))
                that.silhouetteBlue.selected = []
                that.tilesetLayer.show = true
                // 最小
@@ -894,38 +888,35 @@
                that.viewer.camera.setView({
                    // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
                    // fromDegrees()方法，将经纬度和高程转换为世界坐标
                    destination: that.DC.Namespace.Cesium.Cartesian3.fromDegrees(
                    destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
                        that.mapCenter[0],
                        that.mapCenter[1],
                        220.0
                    ),
                    orientation: {
                        // 指向
                        heading: that.DC.Namespace.Cesium.Math.toRadians(-9),
                        heading: global.DC.Namespace.Cesium.Math.toRadians(-9),
                        // 视角
                        pitch: that.DC.Namespace.Cesium.Math.toRadians(-34.54),
                        pitch: global.DC.Namespace.Cesium.Math.toRadians(-34.54),
                        roll: 0.0
                    }
                })
            } else {
                that.tilesetLayer.show = false
                // that.viewer.imageryLayers.remove(that.vecLayer)
                // that.vecLayer = null
                // that.viewer.imageryLayers.remove(that.cvaLayer)
                // that.cvaLayer = null

                that.areaLayer.show = true

                // var provider = new that.DC.Namespace.Cesium.ArcGisMapServerImageryProvider({
                // var provider = new global.DC.Namespace.Cesium.ArcGisMapServerImageryProvider({
                //     url: 'http://arcgis.jxpskj.com:6080/arcgis/rest/services/PingXiang25DMapQP/MapServer'
                // })

                var provider = new that.DC.Namespace.Cesium.UrlTemplateImageryProvider({
                var provider = new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({
                    url: '/wp/{z}/{x}/{y}.png',
                    fileExtension: 'png'
                })

                var baseProvider =
                    new that.DC.Namespace.Cesium.UrlTemplateImageryProvider({
                    new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({
                        url: '/base/{z}/{x}/{y}.png',
                        fileExtension: 'png'
                    })
@@ -938,16 +929,16 @@
                that.viewer.camera.setView({
                    // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
                    // fromDegrees()方法，将经纬度和高程转换为世界坐标
                    destination: that.DC.Namespace.Cesium.Cartesian3.fromDegrees(
                    destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
                        that.mapCenter[0],
                        that.mapCenter[1],
                        400.0
                    ),
                    orientation: {
                        // 指向
                        heading: that.DC.Namespace.Cesium.Math.toRadians(0, 0),
                        heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
                        // 视角
                        pitch: that.DC.Namespace.Cesium.Math.toRadians(-90),
                        pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
                        roll: 0.0
                    }
                })

 src/components/map/components/mapPopup.vue

@@ -459,7 +459,6 @@
            dialogImageUrl: '',
            dialogVisible: false,
            apiUrls: null,
            DC: null,
            tabBtnFlag: '教学科研行政',
            QRCodeFlag: false,
            audioSource: '',
@@ -727,7 +726,6 @@
    },
    created () {
        this.apiUrls = window.$apiUrls
        this.DC = global.DC

        this.audioSynth = window.speechSynthesis
        this.audioMsg = new window.SpeechSynthesisUtterance()
@@ -923,13 +921,13 @@
            }

            // eslint-disable-next-line new-cap
            var positions = this.DC.Transform.transformWGS84ToCartesian(
            var positions = global.DC.Transform.transformWGS84ToCartesian(
                // eslint-disable-next-line new-cap
                new this.DC.Position.fromArray(this.pointPosition)
                new global.DC.Position.fromArray(this.pointPosition)
            )
            this.viewer.scene.globe.depthTestAgainstTerrain = false
            // eslint-disable-next-line no-unused-vars
            var panorama = new this.DC.PanoramaBox(this.viewer, {
            var panorama = new global.DC.PanoramaBox(this.viewer, {
                domId: 'PanoramaBox',
                position: [positions]
            })
@@ -946,13 +944,13 @@
                this.audioCourse = false
            }
            // eslint-disable-next-line new-cap
            var positions = this.DC.Transform.transformWGS84ToCartesian(
            var positions = global.DC.Transform.transformWGS84ToCartesian(
                // eslint-disable-next-line new-cap
                new this.DC.Position.fromArray(this.pointPosition)
                new global.DC.Position.fromArray(this.pointPosition)
            )
            this.viewer.scene.globe.depthTestAgainstTerrain = false
            // eslint-disable-next-line no-unused-vars
            var monitor = new this.DC.PanoramaBox(this.viewer, {
            var monitor = new global.DC.PanoramaBox(this.viewer, {
                domId: 'MonitorBox',
                position: [positions]
            })
@@ -992,7 +990,7 @@
            this.$store.commit('SET_ADDTAGPOPUP', false)

            //   if (this.addTagLayer == null) {
            //     this.addTagLayer = new this.DC.HtmlLayer("addTagLayer");
            //     this.addTagLayer = new global.DC.HtmlLayer("addTagLayer");
            //     this.viewer.addLayer(this.addTagLayer);
            //   }

@@ -1024,8 +1022,8 @@
                    // list: [data],
                    add: true
                })
                // const divIcon = new this.DC.DivIcon(
                //   new that.DC.Position(
                // const divIcon = new global.DC.DivIcon(
                //   new global.DC.Position(
                //     Number(that.addTagPosition.lng),
                //     Number(that.addTagPosition.lat),
                //     0
@@ -1101,7 +1099,7 @@

                this.newPopup(result)
                this.viewer.flyToPosition(
                    new this.DC.Position(
                    new global.DC.Position(
                        Number(result.jd),
                        Number(result.wd),
                        300,
@@ -1116,11 +1114,11 @@
        },

        newPopup (item) {
            const position = this.DC.Transform.transformWGS84ToCartesian(
                new this.DC.Position(Number(item.jd), Number(item.wd), Number(item.gd))
            const position = global.DC.Transform.transformWGS84ToCartesian(
                new global.DC.Position(Number(item.jd), Number(item.wd), Number(item.gd))
            )
            // eslint-disable-next-line no-unused-vars
            var popup = new this.DC.DivForms(this.viewer, {
            var popup = new global.DC.DivForms(this.viewer, {
                domId: 'divFormsDomBox',
                position: [position]
            })

 src/components/map/index.vue

@@ -66,7 +66,6 @@
    },
    data () {
        return {
            DC: null,
            areaLayer: null,
            samllMapFlag: false
        }
@@ -165,8 +164,6 @@

        let viewer, eagleViewer

        that.DC = global.DC

        function distanceSurface () {
            viewer.measure.distanceSurface()
        }
@@ -222,7 +219,7 @@
        }

        function initViewer () {
            viewer = new that.DC.Viewer('viewer-container', {
            viewer = new global.DC.Viewer('viewer-container', {
                contextOptions: {
                    webgl: {
                        stencil: true,
@@ -231,7 +228,7 @@
                }
            })

            eagleViewer = new that.DC.Viewer('eagleEyeMap', {
            eagleViewer = new global.DC.Viewer('eagleEyeMap', {
                animation: false,
                baseLayerPicker: false,
                imageryProvider: false,
@@ -245,11 +242,11 @@
                navigationHelpButton: false,
                navigationInstructionsInitiallyVisible: false,
                creditContainer: undefined
                // sceneMode: that.DC.Namespace.Cesium.SceneMode.SCENE2D
                // sceneMode: global.DC.Namespace.Cesium.SceneMode.SCENE2D
            })

            eagleViewer.imageryLayers.addImageryProvider(
                new that.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
                new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
                    url: ' http://t1.tianditu.gov.cn/vec_w/wmts?tk=9ae78c51a0a28f06444d541148496e36',
                    type: 'wmts',
                    layer: 'vec',
@@ -262,7 +259,7 @@
            )

            eagleViewer.imageryLayers.addImageryProvider(
                new that.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
                new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
                    url: ' http://t1.tianditu.gov.cn/cva_w/wmts?tk=9ae78c51a0a28f06444d541148496e36',
                    type: 'wmts',
                    layer: 'cva',
@@ -277,8 +274,8 @@
            var sceneL = viewer.scene
            var sceneR = eagleViewer.scene

            var handlerL = new that.DC.Namespace.Cesium.ScreenSpaceEventHandler(sceneL.canvas)
            var handlerR = new that.DC.Namespace.Cesium.ScreenSpaceEventHandler(sceneR.canvas)
            var handlerL = new global.DC.Namespace.Cesium.ScreenSpaceEventHandler(sceneL.canvas)
            var handlerR = new global.DC.Namespace.Cesium.ScreenSpaceEventHandler(sceneR.canvas)

            var isLeftTrigger = false

@@ -287,22 +284,22 @@
            handlerL.setInputAction(function (movement) {
                isLeftTrigger = true
                isRightTrigger = false
            }, that.DC.Namespace.Cesium.ScreenSpaceEventType.MOUSE_MOVE)
            }, global.DC.Namespace.Cesium.ScreenSpaceEventType.MOUSE_MOVE)

            handlerR.setInputAction(function (movement) {
                if (that.samllMapFlag) {
                    isLeftTrigger = false
                    isRightTrigger = true
                }
            }, that.DC.Namespace.Cesium.ScreenSpaceEventType.MOUSE_MOVE)
            }, global.DC.Namespace.Cesium.ScreenSpaceEventType.MOUSE_MOVE)

            var syncviewer = function () {
                if (isLeftTrigger) {
                    const position = that.DC.Transform.transformCartesianToWGS84(viewer.camera.position)
                    const position = global.DC.Transform.transformCartesianToWGS84(viewer.camera.position)

                    eagleViewer.camera.flyTo({

                        destination: that.DC.Transform.transformWGS84ToCartesian(new that.DC.Position(position.lng, position.lat, position.alt + 1000)),
                        destination: global.DC.Transform.transformWGS84ToCartesian(new global.DC.Position(position.lng, position.lat, position.alt + 1000)),

                        orientation: {

@@ -349,14 +346,14 @@
            eagleViewer.camera.setView({
                // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
                // fromDegrees()方法，将经纬度和高程转换为世界坐标
                destination: that.DC.Namespace.Cesium.Cartesian3.fromDegrees(
                destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
                    115.871863, 28.743861, 1400.0
                ),
                orientation: {
                    // 指向
                    heading: that.DC.Namespace.Cesium.Math.toRadians(0, 0),
                    heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
                    // 视角
                    pitch: that.DC.Namespace.Cesium.Math.toRadians(-90),
                    pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
                    roll: 0.0
                }
            })
@@ -399,16 +396,16 @@
            that.$refs.leftNav.initialize(viewer)

            // const key = '0f7c1d161d7352116a21aacf0e9f44c1'
            // const vec = that.DC.ImageryLayerFactory.createTdtImageryLayer({
            // const vec = global.DC.ImageryLayerFactory.createTdtImageryLayer({
            //     key
            // })
            // const cva = that.DC.ImageryLayerFactory.createTdtImageryLayer({
            // const cva = global.DC.ImageryLayerFactory.createTdtImageryLayer({
            //     key,
            //     style: 'cva'
            // })
            // viewer.addBaseLayer([vec, cva])

            // const areaLayer = new that.DC.VectorLayer('areaLayer')
            // const areaLayer = new global.DC.VectorLayer('areaLayer')

            // viewer.addLayer(areaLayer)

@@ -420,11 +417,11 @@

            //         item.geometry.rings[0] = item.geometry.rings[0].join(';')

            //         const polygon = new that.DC.Polygon(item.geometry.rings[0])
            //         const polygon = new global.DC.Polygon(item.geometry.rings[0])

            //         polygon.setStyle({

            //             material: that.DC.Namespace.Cesium.Color.fromBytes(255, 255, 255, 0)
            //             material: global.DC.Namespace.Cesium.Color.fromBytes(255, 255, 255, 0)

            //         })

@@ -437,7 +434,7 @@
            //     color: undefined
            // }

            // viewer.on(that.DC.MouseEventType.MOUSE_MOVE, e => {
            // viewer.on(global.DC.MouseEventType.MOUSE_MOVE, e => {
            //     if (e.overlay != undefined) {
            //         if (select.overlay != undefined) {
            //             if (e.overlay != select.overlay) {
@@ -456,7 +453,7 @@
            //             select.color = e.overlay._style.material
            //             select.overlay.setStyle({

            //                 material: that.DC.Namespace.Cesium.Color.fromBytes(32, 108, 247, 158)
            //                 material: global.DC.Namespace.Cesium.Color.fromBytes(32, 108, 247, 158)

            //             })
            //         }
@@ -472,7 +469,7 @@
            //     }
            // })

            // viewer.on(that.DC.MouseEventType.CLICK, e => {
            // viewer.on(global.DC.MouseEventType.CLICK, e => {
            //     if (e.overlay != undefined) {
            //         console.log(e.overlay.attr)
            //     }
@@ -489,7 +486,7 @@
            // })

            // // eslint-disable-next-line camelcase
            // const baselayer_shaded = that.DC.ImageryLayerFactory.createArcGisImageryLayer({
            // const baselayer_shaded = global.DC.ImageryLayerFactory.createArcGisImageryLayer({
            //     url:
            //         'http://services.arcgisonline.com/arcgis/rest/services/World_Shaded_Relief/MapServer'
            // })
@@ -499,7 +496,7 @@
            // })

            // // eslint-disable-next-line camelcase
            // const baselayer_street = that.DC.ImageryLayerFactory.createArcGisImageryLayer({
            // const baselayer_street = global.DC.ImageryLayerFactory.createArcGisImageryLayer({
            //     url:
            //         'http://services.arcgisonline.com/arcgis/rest/services/World_Physical_Map/MapServer'
            // })
@@ -509,7 +506,7 @@
            // })

            // // eslint-disable-next-line camelcase
            // const baselayer_ter = that.DC.ImageryLayerFactory.createArcGisImageryLayer({
            // const baselayer_ter = global.DC.ImageryLayerFactory.createArcGisImageryLayer({
            //     url:
            //         'http://services.arcgisonline.com/arcgis/rest/services/World_Terrain_Base/MapServer'
            // })
@@ -518,10 +515,10 @@
            //     name: '地形'
            // })

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

            // viewer.flyToPosition(
            //     new that.DC.Position(117.08489820, 31.65413916, 1500, 0, -90, 45)
            //     new global.DC.Position(117.08489820, 31.65413916, 1500, 0, -90, 45)
            // )

            viewer.compass.enable = true
@@ -531,14 +528,14 @@
            // DC的鹰眼地图
            // viewer.hawkeyeMap.enable = true
            // viewer.hawkeyeMap.addBaseLayer(
            //     that.DC.ImageryLayerFactory.createAmapImageryLayer({
            //     global.DC.ImageryLayerFactory.createAmapImageryLayer({
            //         crs: 'WGS84'
            //     })
            // )
            // viewer.distanceLegend.enable = true
        }

        that.DC.ready(initViewer)
        global.DC.ready(initViewer)
    },
    methods: {
        mapClick (e) {
@@ -547,10 +544,10 @@
        },

        createdLayers (viewer) {
            const layerGroup = new this.DC.LayerGroup('modelBox')
            const layerGroup = new global.DC.LayerGroup('modelBox')
            viewer.addLayerGroup(layerGroup)

            this.areaLayer = new this.DC.VectorLayer('areaLayer')
            this.areaLayer = new global.DC.VectorLayer('areaLayer')
            layerGroup.addLayer(this.areaLayer)
        }
    }

 src/components/orgNavBar/index.vue

@@ -1,133 +1,127 @@
<template>
  <public-box class="public-org-nav-bar">
    <template slot="public-box-header">
      <div class="title">
        <img class="icon deblurring" src="/img/icon/jg.png" alt />
        <span>{{ orgNavBarTitle }}</span>
      </div>
      <img class="close" src="/img/navicon/close.png" alt @click="closeModel" />
    </template>
    <template slot="public-box-content">
      <ul>
        <li
          v-for="(item, index) in orgNavBarList"
          :key="index"
          @click="mapPopup(item)"
        >
          <img :src="item.icon" alt />
          <span>{{ item.navTitle }}</span>
        </li>
      </ul>
    </template>
  </public-box>
    <public-box class="public-org-nav-bar">
        <template slot="public-box-header">
            <div class="title">
                <img class="icon deblurring" src="/img/icon/jg.png" alt />
                <span>{{ orgNavBarTitle }}</span>
            </div>
            <img class="close" src="/img/navicon/close.png" alt @click="closeModel" />
        </template>
        <template slot="public-box-content">
            <ul>
                <li v-for="(item, index) in orgNavBarList" :key="index" @click="mapPopup(item)">
                    <img :src="item.icon" alt />
                    <span>{{ item.navTitle }}</span>
                </li>
            </ul>
        </template>
    </public-box>
</template>

<script>
import { mapGetters } from "vuex";
import { mapGetters } from 'vuex'

export default {
  name: "OrgNavBar",
  data() {
    return {
      DC: null,
    };
  },
  created() {
    this.DC = global.DC;
  },
  computed: {
    ...mapGetters([
      "viewer",
      "popupBgUrl",
      "pupupQRUrl",
      // 点信息
      "pointPosition",
      // 点名称
      "stateName",
      // 地址
      "siteName",
      // 介绍
      "introduceText",
      // 全景地址
      "panoramaUrl",
      "orgNavBarList",
      "orgNavBarTitle",
    ]),
  },
  methods: {
    mapPopup(item) {
      this.$store.commit("CLEAR_ALL", null);

      var imgArr = item.bgImg.split(",");

      this.$store.commit("SET_POPUPBGURL", imgArr[0]);
      this.$store.commit("SET_POPUPQRURL", item.QRImg);
      this.$store.commit("SET_POINTPOSITION", [
        Number(item.longitude),
        Number(item.latitude),
        Number(item.alt),
        Number(item.heading),
        Number(item.pitch),
        Number(item.roll),
      ]);
      this.$store.commit("SET_STATENAME", item.navTitle);
      this.$store.commit("SET_SITENAME", item.address);
      this.$store.commit("SET_TELEPHONE", item.telephone);
      this.$store.commit("SET_INTRODUCETEXT", item.introduce);
      this.$store.commit("SET_POPUPIMGATLAS", imgArr);
      if (item.videourl && item.videourl != "") {
        this.$store.commit("SET_MONITORURL", item.videourl);
      }

      this.newPopup(item);
      this.viewer.flyToPosition(
        new this.DC.Position(
          Number(item.longitude),
          Number(item.latitude),
          300,
          Number(item.heading),
          Number(item.pitch),
          Number(item.roll)
        ),
        function () {},
        3
      );
    name: 'OrgNavBar',
    data () {
        return {
        }
    },

    newPopup(item) {
      const position = this.DC.Transform.transformWGS84ToCartesian(
        new this.DC.Position(
          Number(item.longitude),
          Number(item.latitude),
          Number(item.alt)
        )
      );
      // eslint-disable-next-line no-unused-vars
      var popup = new this.DC.DivForms(this.viewer, {
        domId: "divFormsDomBox",
        position: [position],
      });

      this.$store.commit("SET_PANORAMAPOPUP", false);
      this.$store.commit("SET_MONITORPOPUP", false);
      this.$store.commit("SET_DETAILSPOPUP", true);
    created () {
    },

    closeModel() {
      var path = this.$route.path;
      if (path.indexOf("/orgnav") != -1) {
        this.$store.dispatch("delVisitedViews", this.$route);
        this.$router.push("/pcLayout/default");
      }

      this.$store.commit("SET_ORGNAVBARTITLE", "");

      this.$store.commit("SET_ORGNAVBARFLAG", false);

      this.$store.commit("SET_ORGNAVBARLIST", []);
    computed: {
        ...mapGetters([
            'viewer',
            'popupBgUrl',
            'pupupQRUrl',
            // 点信息
            'pointPosition',
            // 点名称
            'stateName',
            // 地址
            'siteName',
            // 介绍
            'introduceText',
            // 全景地址
            'panoramaUrl',
            'orgNavBarList',
            'orgNavBarTitle'
        ])
    },
  },
};
    methods: {
        mapPopup (item) {
            this.$store.commit('CLEAR_ALL', null)

            var imgArr = item.bgImg.split(',')

            this.$store.commit('SET_POPUPBGURL', imgArr[0])
            this.$store.commit('SET_POPUPQRURL', item.QRImg)
            this.$store.commit('SET_POINTPOSITION', [
                Number(item.longitude),
                Number(item.latitude),
                Number(item.alt),
                Number(item.heading),
                Number(item.pitch),
                Number(item.roll)
            ])
            this.$store.commit('SET_STATENAME', item.navTitle)
            this.$store.commit('SET_SITENAME', item.address)
            this.$store.commit('SET_TELEPHONE', item.telephone)
            this.$store.commit('SET_INTRODUCETEXT', item.introduce)
            this.$store.commit('SET_POPUPIMGATLAS', imgArr)
            if (item.videourl && item.videourl != '') {
                this.$store.commit('SET_MONITORURL', item.videourl)
            }

            this.newPopup(item)
            this.viewer.flyToPosition(
                new global.DC.Position(
                    Number(item.longitude),
                    Number(item.latitude),
                    300,
                    Number(item.heading),
                    Number(item.pitch),
                    Number(item.roll)
                ),
                function () { },
                3
            )
        },

        newPopup (item) {
            const position = global.DC.Transform.transformWGS84ToCartesian(
                new global.DC.Position(
                    Number(item.longitude),
                    Number(item.latitude),
                    Number(item.alt)
                )
            )
            // eslint-disable-next-line no-unused-vars
            var popup = new global.DC.DivForms(this.viewer, {
                domId: 'divFormsDomBox',
                position: [position]
            })

            this.$store.commit('SET_PANORAMAPOPUP', false)
            this.$store.commit('SET_MONITORPOPUP', false)
            this.$store.commit('SET_DETAILSPOPUP', true)
        },

        closeModel () {
            var path = this.$route.path
            if (path.indexOf('/orgnav') != -1) {
                this.$store.dispatch('delVisitedViews', this.$route)
                this.$router.push('/pcLayout/default')
            }

            this.$store.commit('SET_ORGNAVBARTITLE', '')

            this.$store.commit('SET_ORGNAVBARFLAG', false)

            this.$store.commit('SET_ORGNAVBARLIST', [])
        }
    }
}
</script>

<style scoped lang="scss"></style>

 src/components/searchDetails/index.vue

@@ -1,317 +1,310 @@
<template>
  <div class="search-nav-bar" ref="searchNavBar">
    <div class="container">
      <div class="header" @mousedown="move" :class="{ move: moveFlag }">
        <div class="title">
          <img class="icon deblurring" src="/img/icon/search.png" alt />
          <span>查询结果</span>
    <div class="search-nav-bar" ref="searchNavBar">
        <div class="container">
            <div class="header" @mousedown="move" :class="{ move: moveFlag }">
                <div class="title">
                    <img class="icon deblurring" src="/img/icon/search.png" alt />
                    <span>查询结果</span>
                </div>
                <img class="close" src="/img/navicon/close.png" alt @click="closeModel" />
            </div>
            <div class="content">
                <ul>
                    <li
                        v-for="(item, index) in searchPopupList"
                        :key="index"
                        @click="mapPopup(item)"
                    >
                        <img src="/img/navicon/tag.png" alt />
                        <span>{{ item.mechanismname }}</span>
                    </li>
                </ul>
            </div>
        </div>
        <img
          class="close"
          src="/img/navicon/close.png"
          alt
          @click="closeModel"
        />
      </div>
      <div class="content">
        <ul>
          <li
            v-for="(item, index) in searchPopupList"
            :key="index"
            @click="mapPopup(item)"
          >
            <img src="/img/navicon/tag.png" alt />
            <span>{{ item.mechanismname }}</span>
          </li>
        </ul>
      </div>
    </div>
  </div>
</template>

<script>
import { mapGetters } from "vuex";
import { mapGetters } from 'vuex'

export default {
  name: "searchDetails",
  data() {
    return {
      moveFlag: false,
      DC: null,
    };
  },
  created() {
    this.DC = global.DC;
  },
  computed: {
    ...mapGetters([
      "viewer",
      "popupBgUrl",
      "pupupQRUrl",
      // 点信息
      "pointPosition",
      // 点名称
      "stateName",
      // 地址
      "siteName",
      // 介绍
      "introduceText",
      // 全景地址
      "panoramaUrl",
      "searchPopupList",
    ]),
  },
  methods: {
    move(e) {
      const that = this;
      const odiv = this.$refs.searchNavBar; // 获取目标元素
      // 算出鼠标相对元素的位置
      const disX = e.clientX - odiv.offsetLeft;
      const disY = e.clientY - odiv.offsetTop;

      const disH = odiv.offsetHeight;
      const disW = odiv.offsetWidth;

      document.onmousemove = (e) => {
        that.moveFlag = true;
        // 鼠标按下并移动的事件
        // 用鼠标的位置减去鼠标相对元素的位置，得到元素的位置
        let left = e.clientX - disX;
        let top = e.clientY - disY;

        // 绑定元素位置到positionX和positionY上面

        if (left >= window.innerWidth - disW) {
          left = window.innerWidth - disW;
    name: 'searchDetails',
    data () {
        return {
            moveFlag: false
        }
    },
    created () {
    },
    computed: {
        ...mapGetters([
            'viewer',
            'popupBgUrl',
            'pupupQRUrl',
            // 点信息
            'pointPosition',
            // 点名称
            'stateName',
            // 地址
            'siteName',
            // 介绍
            'introduceText',
            // 全景地址
            'panoramaUrl',
            'searchPopupList'
        ])
    },
    methods: {
        move (e) {
            const that = this
            const odiv = this.$refs.searchNavBar // 获取目标元素
            // 算出鼠标相对元素的位置
            const disX = e.clientX - odiv.offsetLeft
            const disY = e.clientY - odiv.offsetTop

        if (left <= 0) {
          left = 0;
            const disH = odiv.offsetHeight
            const disW = odiv.offsetWidth

            document.onmousemove = (e) => {
                that.moveFlag = true
                // 鼠标按下并移动的事件
                // 用鼠标的位置减去鼠标相对元素的位置，得到元素的位置
                let left = e.clientX - disX
                let top = e.clientY - disY

                // 绑定元素位置到positionX和positionY上面

                if (left >= window.innerWidth - disW) {
                    left = window.innerWidth - disW
                }

                if (left <= 0) {
                    left = 0
                }

                if (top >= window.innerHeight - disH) {
                    top = window.innerHeight - disH
                }

                if (top <= 60) {
                    top = 60
                }

                // 移动当前元素
                odiv.style.left = left + 'px'
                odiv.style.top = top + 'px'
                odiv.style.bottom = 'auto'
            }
            document.onmouseup = (e) => {
                that.moveFlag = false
                document.onmousemove = null
                document.onmouseup = null
            }
        },

        mapPopup (item) {
            this.$store.commit('CLEAR_ALL', null)

            var imgArr = item.tpurl.split(',')

            this.$store.commit('SET_POPUPBGURL', imgArr[0])
            this.$store.commit('SET_POPUPQRURL', item.codeurl)
            this.$store.commit('SET_POINTPOSITION', [
                Number(item.jd),
                Number(item.wd),
                Number(item.gd),
                Number(item.heading),
                Number(item.pitch),
                Number(item.roll)
            ])
            this.$store.commit('SET_STATENAME', item.mechanismname)
            this.$store.commit('SET_SITENAME', item.address)
            this.$store.commit('SET_TELEPHONE', item.telephone)
            this.$store.commit('SET_INTRODUCETEXT', item.introduce)
            this.$store.commit('SET_PANORAMAURL', item.panoramaurl)
            this.$store.commit('SET_POPUPIMGATLAS', imgArr)
            if (item.videourl && item.videourl != '') {
                this.$store.commit('SET_MONITORURL', item.videourl)
            }
            if (item.jx != undefined && item.jx != '') {
                var tabOne = item.jx.split(',')
                this.$store.commit('SET_TEACHLIST', tabOne)
            } else {
                this.$store.commit('SET_TEACHLIST', [])
            }

            if (item.sh != undefined && item.sh != '') {
                var tabTwo = item.sh.split(',')
                this.$store.commit('SET_LIVELIST', tabTwo)
            } else {
                this.$store.commit('SET_LIVELIST', [])
            }

            this.newPopup(item)
            this.viewer.flyToPosition(
                new global.DC.Position(
                    Number(item.jd),
                    Number(item.wd),
                    Number(300),
                    Number(item.heading),
                    Number(item.pitch),
                    Number(item.roll)
                ),
                function () { },
                3
            )
        },

        newPopup (item) {
            const position = global.DC.Transform.transformWGS84ToCartesian(
                new global.DC.Position(
                    Number(item.jd),
                    Number(item.wd),
                    Number(item.gd),
                    Number(item.heading),
                    Number(item.pitch),
                    Number(item.roll)
                )
            )
            // eslint-disable-next-line no-unused-vars
            var popup = new global.DC.DivForms(this.viewer, {
                domId: 'divFormsDomBox',
                position: [position]
            })

            this.$store.commit('SET_PANORAMAPOPUP', false)
            this.$store.commit('SET_MONITORPOPUP', false)
            this.$store.commit('SET_DETAILSPOPUP', true)
        },

        closeModel () {
            this.$store.commit('SET_SEARCHPOPUPFLAG', false)

            this.$store.commit('SET_SEARCHPOPUPLIST', [])
        }

        if (top >= window.innerHeight - disH) {
          top = window.innerHeight - disH;
        }

        if (top <= 60) {
          top = 60;
        }

        // 移动当前元素
        odiv.style.left = left + "px";
        odiv.style.top = top + "px";
        odiv.style.bottom = "auto";
      };
      document.onmouseup = (e) => {
        that.moveFlag = false;
        document.onmousemove = null;
        document.onmouseup = null;
      };
    },

    mapPopup(item) {
      this.$store.commit("CLEAR_ALL", null);

      var imgArr = item.tpurl.split(",");

      this.$store.commit("SET_POPUPBGURL", imgArr[0]);
      this.$store.commit("SET_POPUPQRURL", item.codeurl);
      this.$store.commit("SET_POINTPOSITION", [
        Number(item.jd),
        Number(item.wd),
        Number(item.gd),
        Number(item.heading),
        Number(item.pitch),
        Number(item.roll),
      ]);
      this.$store.commit("SET_STATENAME", item.mechanismname);
      this.$store.commit("SET_SITENAME", item.address);
      this.$store.commit("SET_TELEPHONE", item.telephone);
      this.$store.commit("SET_INTRODUCETEXT", item.introduce);
      this.$store.commit("SET_PANORAMAURL", item.panoramaurl);
      this.$store.commit("SET_POPUPIMGATLAS", imgArr);
      if (item.videourl && item.videourl != "") {
        this.$store.commit("SET_MONITORURL", item.videourl);
      }
      if (item.jx != undefined && item.jx != "") {
        var tabOne = item.jx.split(",");
        this.$store.commit("SET_TEACHLIST", tabOne);
      } else {
        this.$store.commit("SET_TEACHLIST", []);
      }

      if (item.sh != undefined && item.sh != "") {
        var tabTwo = item.sh.split(",");
        this.$store.commit("SET_LIVELIST", tabTwo);
      } else {
        this.$store.commit("SET_LIVELIST", []);
      }

      this.newPopup(item);
      this.viewer.flyToPosition(
        new this.DC.Position(
          Number(item.jd),
          Number(item.wd),
          Number(300),
          Number(item.heading),
          Number(item.pitch),
          Number(item.roll)
        ),
        function () {},
        3
      );
    },

    newPopup(item) {
      const position = this.DC.Transform.transformWGS84ToCartesian(
        new this.DC.Position(
          Number(item.jd),
          Number(item.wd),
          Number(item.gd),
          Number(item.heading),
          Number(item.pitch),
          Number(item.roll)
        )
      );
      // eslint-disable-next-line no-unused-vars
      var popup = new this.DC.DivForms(this.viewer, {
        domId: "divFormsDomBox",
        position: [position],
      });

      this.$store.commit("SET_PANORAMAPOPUP", false);
      this.$store.commit("SET_MONITORPOPUP", false);
      this.$store.commit("SET_DETAILSPOPUP", true);
    },

    closeModel() {
      this.$store.commit("SET_SEARCHPOPUPFLAG", false);

      this.$store.commit("SET_SEARCHPOPUPLIST", []);
    },
  },
};
    }
}
</script>

<style scoped lang="scss">
.search-nav-bar {
  position: fixed;
  width: 322px;
  height: auto;
  border-radius: 8px;
  top: 140px;
  left: 140px;
  background-color: transparent;
  z-index: 999;
  font-size: 14px;
    position: fixed;
    width: 322px;
    height: auto;
    border-radius: 8px;
    top: 140px;
    left: 140px;
    background-color: transparent;
    z-index: 999;
    font-size: 14px;

  .container {
    .header {
      position: relative;
      border-radius: 8px 8px 0 0;
      width: 100%;
      height: 36px;
      line-height: 36px;
      background: rgba(0, 131, 176, 0.7); /* fallback for old browsers */
      background: -webkit-linear-gradient(
        to left,
        rgba(0, 180, 219, 0.7),
        rgba(0, 131, 176, 0.7)
      ); /* Chrome 10-25, Safari 5.1-6 */
      background: linear-gradient(
        to left,
        rgba(0, 180, 219, 0.7),
        rgba(0, 131, 176, 0.7)
      ); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    .container {
        .header {
            position: relative;
            border-radius: 8px 8px 0 0;
            width: 100%;
            height: 36px;
            line-height: 36px;
            background: rgba(0, 131, 176, 0.7); /* fallback for old browsers */
            background: -webkit-linear-gradient(
                to left,
                rgba(0, 180, 219, 0.7),
                rgba(0, 131, 176, 0.7)
            ); /* Chrome 10-25, Safari 5.1-6 */
            background: linear-gradient(
                to left,
                rgba(0, 180, 219, 0.7),
                rgba(0, 131, 176, 0.7)
            ); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

      .title {
        padding-left: 10px;
            .title {
                padding-left: 10px;

        img {
          width: 20px;
          height: 20px;
          vertical-align: middle;
                img {
                    width: 20px;
                    height: 20px;
                    vertical-align: middle;
                }

                span {
                    margin-left: 6px;
                    display: inline-block;
                    vertical-align: middle;
                    color: #fff;
                }
            }

            .close {
                position: absolute;
                right: 6px;
                top: 0;
                left: auto;
                bottom: 0;
                margin: auto;
                width: 14px;
                height: 14px;
                cursor: pointer;
            }
        }

        span {
          margin-left: 6px;
          display: inline-block;
          vertical-align: middle;
          color: #fff;
        .move {
            cursor: move;
        }
      }

      .close {
        position: absolute;
        right: 6px;
        top: 0;
        left: auto;
        bottom: 0;
        margin: auto;
        width: 14px;
        height: 14px;
        cursor: pointer;
      }
    }
        .content {
            clear: both;
            width: 100%;
            height: 440px;
            margin-top: 0px;
            text-align: center;
            overflow-y: auto;
            background: rgba(0, 131, 176, 0.7); /* fallback for old browsers */
            background: -webkit-linear-gradient(
                to left,
                rgba(0, 180, 219, 0.7),
                rgba(0, 131, 176, 0.7)
            ); /* Chrome 10-25, Safari 5.1-6 */
            background: linear-gradient(
                to left,
                rgba(0, 180, 219, 0.7),
                rgba(0, 131, 176, 0.7)
            ); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
            border-radius: 0 0 8px 8px;

    .move {
      cursor: move;
    }
            ul {
                padding: 15px;
                padding-top: 4px;

    .content {
      clear: both;
      width: 100%;
      height: 440px;
      margin-top: 0px;
      text-align: center;
      overflow-y: auto;
      background: rgba(0, 131, 176, 0.7); /* fallback for old browsers */
      background: -webkit-linear-gradient(
        to left,
        rgba(0, 180, 219, 0.7),
        rgba(0, 131, 176, 0.7)
      ); /* Chrome 10-25, Safari 5.1-6 */
      background: linear-gradient(
        to left,
        rgba(0, 180, 219, 0.7),
        rgba(0, 131, 176, 0.7)
      ); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
      border-radius: 0 0 8px 8px;
                li {
                    padding-left: 24px;
                    position: relative;
                    height: 40px;
                    line-height: 40px;
                    list-style: none;
                    border-bottom: 1px dashed #ccc;
                    text-align: left;

      ul {
        padding: 15px;
        padding-top: 4px;
                    img {
                        position: absolute;
                        left: 0;
                        right: auto;
                        top: 0;
                        bottom: 0;
                        margin: auto;
                        width: 14px;
                    }

        li {
          padding-left: 24px;
          position: relative;
          height: 40px;
          line-height: 40px;
          list-style: none;
          border-bottom: 1px dashed #ccc;
          text-align: left;
                    span {
                        color: #fff;
                        cursor: pointer;
                    }

          img {
            position: absolute;
            left: 0;
            right: auto;
            top: 0;
            bottom: 0;
            margin: auto;
            width: 14px;
          }

          span {
            color: #fff;
            cursor: pointer;
          }

          span:hover {
            text-decoration: underline;
          }
                    span:hover {
                        text-decoration: underline;
                    }
                }
            }
        }
      }
    }
  }
}
</style>

 src/components/serviceNavBar/index.vue

@@ -1,143 +1,139 @@
<template>
  <public-box class="public-org-nav-bar">
    <template slot="public-box-header">
      <div class="title">
        <img class="icon deblurring" :src="headerLog" alt />
        <span>{{ title }}</span>
      </div>
      <img class="close" src="/img/navicon/close.png" alt @click="closeModel" />
    </template>
    <template slot="public-box-content">
      <div class="tab" v-show="false">
        <ul>
          <li
            :class="{ on: item.flag }"
            v-for="(item, index) in titleList"
            :key="index"
            @click="topNavClick(item, index)"
          >
            {{ item.title }}
          </li>
        </ul>
      </div>
      <ul>
        <li
          v-for="(item, index) in itemNavList"
          :key="index"
          @click="mapPopup(item.details)"
        >
          <img :src="item.icon" alt />
          <span>{{ item.navTitle }}</span>
        </li>
      </ul>
    </template>
  </public-box>
    <public-box class="public-org-nav-bar">
        <template slot="public-box-header">
            <div class="title">
                <img class="icon deblurring" :src="headerLog" alt />
                <span>{{ title }}</span>
            </div>
            <img class="close" src="/img/navicon/close.png" alt @click="closeModel" />
        </template>
        <template slot="public-box-content">
            <div class="tab" v-show="false">
                <ul>
                    <li
                        :class="{ on: item.flag }"
                        v-for="(item, index) in titleList"
                        :key="index"
                        @click="topNavClick(item, index)"
                    >{{ item.title }}</li>
                </ul>
            </div>
            <ul>
                <li
                    v-for="(item, index) in itemNavList"
                    :key="index"
                    @click="mapPopup(item.details)"
                >
                    <img :src="item.icon" alt />
                    <span>{{ item.navTitle }}</span>
                </li>
            </ul>
        </template>
    </public-box>
</template>

<script>
import { mapGetters } from "vuex";
import { getList, getLifeList } from "@/api/pc/service/index";
import { mapGetters } from 'vuex'
import { getList, getLifeList } from '@/api/pc/service/index'

export default {
  name: "ServiceNavBar",
  data() {
    return {
      itemNavList: [],
      DC: null,
      ourLayer: null,
    };
  },
  props: {
    title: {
      type: String,
    name: 'ServiceNavBar',
    data () {
        return {
            itemNavList: [],
            ourLayer: null
        }
    },
    headerLog: {
      type: String,
    props: {
        title: {
            type: String
        },
        headerLog: {
            type: String
        },
        arcCode: {
            type: Number
        }
    },
    arcCode: {
      type: Number,
    computed: {
        ...mapGetters([
            'viewer',
            'popupBgUrl',
            'pupupQRUrl',
            // 点信息
            'pointPosition',
            // 点名称
            'stateName',
            // 地址
            'siteName',
            // 介绍
            'introduceText',
            // 全景地址
            'panoramaUrl'
        ])
    },
  },
  computed: {
    ...mapGetters([
      "viewer",
      "popupBgUrl",
      "pupupQRUrl",
      // 点信息
      "pointPosition",
      // 点名称
      "stateName",
      // 地址
      "siteName",
      // 介绍
      "introduceText",
      // 全景地址
      "panoramaUrl",
    ]),
  },
  created() {
    this.DC = global.DC;
    this.titleList = [];
    //三江校区//"土木楼"//"科学园"//"黄河路"//"红旗校区"
    getList().then((res) => {
      res.data.data.forEach((item) => {
        // console.log(item, "see");
        this.titleList.push({
          title: item.dictValue,
          flag: false,
          key: item.dictKey,
        });
      });
    created () {
        this.titleList = []
        // 三江校区//"土木楼"//"科学园"//"黄河路"//"红旗校区"
        getList().then((res) => {
            res.data.data.forEach((item) => {
                // console.log(item, "see");
                this.titleList.push({
                    title: item.dictValue,
                    flag: false,
                    key: item.dictKey
                })
            })

      this.titleList[0].flag = true;
            this.titleList[0].flag = true

      this.getChilsNavs(this.titleList[0].key);
    });
  },
  mounted() {},
  methods: {
    closeModel() {
      this.$parent.closeModel();
            this.getChilsNavs(this.titleList[0].key)
        })
    },
    topNavClick(item, index) {
      this.titleList.forEach((item) => {
        item.flag = false;
      });
    mounted () { },
    methods: {
        closeModel () {
            this.$parent.closeModel()
        },
        topNavClick (item, index) {
            this.titleList.forEach((item) => {
                item.flag = false
            })

      this.titleList[index].flag = true;
            this.titleList[index].flag = true

      this.getChilsNavs(item.key);
    },
    getChilsNavs(campus) {
      this.itemNavList = [];
      let that = this;
      //   console.log(this.arcCode, "see22");
      //判断是否是当前所需要图层并创建 属性为 this.arrCode
      if (this.ourLayer != null) {
        this.ourLayer.clear();
      } else {
        this.ourLayer = new this.DC.HtmlLayer("Layer" + this.arcCode);
        this.viewer.addLayer(this.ourLayer);
      }
      //   console.log(this.ourLayer, "see");
      getLifeList({ lifetype: this.arcCode, campus: campus }).then((res) => {
        res.data.data.records.forEach((item) => {
          //   console.log(item, "see");
          this.itemNavList.push({
            navTitle: item.mechanismname,
            icon: "/img/navicon/tag.png",
            details: item,
          });
          //创建图标 做生活设施分层标签
          that.addDivIcon(item, this.ourLayer);
        });
      });
    },
    addDivIcon(item, mylayer) {
      let that = this;
      const divIcon = new global.DC.DivIcon(
        new global.DC.Position(Number(item.jd), Number(item.wd), 0),
        `
            this.getChilsNavs(item.key)
        },
        getChilsNavs (campus) {
            this.itemNavList = []
            const that = this
            //   console.log(this.arcCode, "see22");
            // 判断是否是当前所需要图层并创建 属性为 this.arrCode
            if (this.ourLayer != null) {
                this.ourLayer.clear()
            } else {
                this.ourLayer = new global.DC.HtmlLayer('Layer' + this.arcCode)
                this.viewer.addLayer(this.ourLayer)
            }
            //   console.log(this.ourLayer, "see");
            getLifeList({ lifetype: this.arcCode, campus: campus }).then((res) => {
                res.data.data.records.forEach((item) => {
                    //   console.log(item, "see");
                    this.itemNavList.push({
                        navTitle: item.mechanismname,
                        icon: '/img/navicon/tag.png',
                        details: item
                    })
                    // 创建图标 做生活设施分层标签
                    that.addDivIcon(item, this.ourLayer)
                })
            })
        },
        addDivIcon (item, mylayer) {
            const that = this
            const divIcon = new global.DC.DivIcon(
                new global.DC.Position(Number(item.jd), Number(item.wd), 0),
                `
                              <div class="tag-entitys-box">
                                  <div class="tag-content">
                                      ${item.mechanismname}
@@ -147,83 +143,83 @@
                                  </div>
                              </div>
                          `
      );
      //订阅事件
      divIcon.on(global.DC.MouseEventType.CLICK, (e) => {
        // console.log(item, "see");
        // that.openPopups({
        //   lng: e.overlay.position.lng,
        //   lat: e.overlay.position.lat,
        //   item: item,
        // });
        that.mapPopup(item);
      });
      mylayer.addOverlay(divIcon);
            )
            // 订阅事件
            divIcon.on(global.DC.MouseEventType.CLICK, (e) => {
                // console.log(item, "see");
                // that.openPopups({
                //   lng: e.overlay.position.lng,
                //   lat: e.overlay.position.lat,
                //   item: item,
                // });
                that.mapPopup(item)
            })
            mylayer.addOverlay(divIcon)
        },
        mapPopup (param) {
            var result = param
            this.$store.commit('CLEAR_ALL', null)

            var imgArr = result.tpurl.split(',')

            this.$store.commit('SET_POPUPBGURL', imgArr[0])
            this.$store.commit('SET_POPUPQRURL', result.codeurl)
            this.$store.commit('SET_POINTPOSITION', [
                Number(result.jd),
                Number(result.wd),
                Number(result.gd),
                Number(result.heading),
                Number(result.pitch),
                Number(result.roll)
            ])
            this.$store.commit('SET_STATENAME', result.mechanismname)
            this.$store.commit('SET_SITENAME', result.address)
            this.$store.commit('SET_TELEPHONE', result.telephone)
            this.$store.commit('SET_INTRODUCETEXT', result.introduce)
            this.$store.commit('SET_PANORAMAURL', result.panoramaurl)
            this.$store.commit('SET_POPUPIMGATLAS', imgArr)

            if (result.videourl && result.videourl != '') {
                this.$store.commit('SET_MONITORURL', result.videourl)
            }

            this.newPopup(result)
            this.viewer.flyToPosition(
                new global.DC.Position(
                    Number(result.jd),
                    Number(result.wd),
                    300,
                    Number(result.heading),
                    Number(result.pitch),
                    Number(result.roll)
                ),
                function () { },
                3
            )
        },
        newPopup (item) {
            const position = global.DC.Transform.transformWGS84ToCartesian(
                new global.DC.Position(Number(item.jd), Number(item.wd), Number(item.gd))
            )
            // eslint-disable-next-line no-unused-vars
            var popup = new global.DC.DivForms(this.viewer, {
                domId: 'divFormsDomBox',
                position: [position]
            })

            this.$store.commit('SET_PANORAMAPOPUP', false)
            this.$store.commit('SET_MONITORPOPUP', false)
            this.$store.commit('SET_DETAILSPOPUP', true)
        }
    },
    mapPopup(param) {
      var result = param;
      this.$store.commit("CLEAR_ALL", null);

      var imgArr = result.tpurl.split(",");

      this.$store.commit("SET_POPUPBGURL", imgArr[0]);
      this.$store.commit("SET_POPUPQRURL", result.codeurl);
      this.$store.commit("SET_POINTPOSITION", [
        Number(result.jd),
        Number(result.wd),
        Number(result.gd),
        Number(result.heading),
        Number(result.pitch),
        Number(result.roll),
      ]);
      this.$store.commit("SET_STATENAME", result.mechanismname);
      this.$store.commit("SET_SITENAME", result.address);
      this.$store.commit("SET_TELEPHONE", result.telephone);
      this.$store.commit("SET_INTRODUCETEXT", result.introduce);
      this.$store.commit("SET_PANORAMAURL", result.panoramaurl);
      this.$store.commit("SET_POPUPIMGATLAS", imgArr);

      if (result.videourl && result.videourl != "") {
        this.$store.commit("SET_MONITORURL", result.videourl);
      }

      this.newPopup(result);
      this.viewer.flyToPosition(
        new this.DC.Position(
          Number(result.jd),
          Number(result.wd),
          300,
          Number(result.heading),
          Number(result.pitch),
          Number(result.roll)
        ),
        function () {},
        3
      );
    },
    newPopup(item) {
      const position = this.DC.Transform.transformWGS84ToCartesian(
        new this.DC.Position(Number(item.jd), Number(item.wd), Number(item.gd))
      );
      // eslint-disable-next-line no-unused-vars
      var popup = new this.DC.DivForms(this.viewer, {
        domId: "divFormsDomBox",
        position: [position],
      });

      this.$store.commit("SET_PANORAMAPOPUP", false);
      this.$store.commit("SET_MONITORPOPUP", false);
      this.$store.commit("SET_DETAILSPOPUP", true);
    },
  },
  destroyed() {
    if (this.ourLayer != null) {
      this.ourLayer.remove();
      this.ourLayer = null;
    destroyed () {
        if (this.ourLayer != null) {
            this.ourLayer.remove()
            this.ourLayer = null
        }
        this.$store.commit('SET_DETAILSPOPUP', false)
    }
    this.$store.commit("SET_DETAILSPOPUP", false);
  },
};
}
</script>

<style scoped lang="scss"></style>

 src/pcviews/specialmap/welcome.vue

@@ -1,220 +1,210 @@
/* * @Author: Morpheus * @Name: 校区迎新 * @Date: 2021-11-15 17:14:47 * @Last
Modified by: Morpheus * @Last Modified time: 2022-01-26 10:51:24 */
<template>
  <div>
    <div class="welcome-container">
      <div class="header">
        <div class="title">
          {{ title }}
          <a href="javascript:void(0);" title="全景浏览">
            <img
              @click="panoramaPlay"
              class="panorama-control"
              src="/img/icon/panorama.png"
              alt=""
            />
          </a>
          <a href="javascript:void(0);" title="语音介绍">
            <img
              @click="audioPlay"
              class="audio-control"
              src="/img/navicon/audio.png"
              alt=""
            />
          </a>
          <a href="javascript:void(0);" title="关闭">
            <img
              @click="closeModel"
              class="close-box"
              src="/img/navicon/close.png"
              alt=""
            />
          </a>
    <div>
        <div class="welcome-container">
            <div class="header">
                <div class="title">
                    {{ title }}
                    <a href="javascript:void(0);" title="全景浏览">
                        <img
                            @click="panoramaPlay"
                            class="panorama-control"
                            src="/img/icon/panorama.png"
                            alt
                        />
                    </a>
                    <a href="javascript:void(0);" title="语音介绍">
                        <img
                            @click="audioPlay"
                            class="audio-control"
                            src="/img/navicon/audio.png"
                            alt
                        />
                    </a>
                    <a href="javascript:void(0);" title="关闭">
                        <img @click="closeModel" class="close-box" src="/img/navicon/close.png" alt />
                    </a>
                </div>
            </div>
            <div class="content-box">
                <div class="img-exhibition">
                    <div class="content">
                        <el-carousel :interval="5000" arrow="always" height="300px">
                            <el-carousel-item v-for="item in list" :key="item">
                                <el-image :src="item" :preview-src-list="[item]"></el-image>
                            </el-carousel-item>
                        </el-carousel>
                    </div>
                </div>
                <div class="organizer">主办：{{ sponsor }}</div>
                <div class="undertake">承办：{{ undertake }}</div>
                <div class="time-box">时间：{{ time }}</div>
                <div class="text-introduce">
                    <div class="title">相关介绍：</div>
                    <div class="content">
                        <p v-text="introduce"></p>
                    </div>
                </div>
                <div class="panorama-box" v-show="panoramaShow">
                    <div class="title">
                        全景浏览
                        <a href="javascript:void(0);" title="关闭">
                            <img
                                @click="(panoramaShow = false), (panoramaUrl = '')"
                                class="close-box"
                                src="/img/navicon/close.png"
                                alt
                            />
                        </a>
                    </div>
                    <div class="content">
                        <iframe
                            style="width: 100%; height: 100%"
                            :src="panoramaUrl"
                            frameborder="0"
                        ></iframe>
                    </div>
                </div>
            </div>
        </div>
      </div>
      <div class="content-box">
        <div class="img-exhibition">
          <div class="content">
            <el-carousel :interval="5000" arrow="always" height="300px">
              <el-carousel-item v-for="item in list" :key="item">
                <el-image :src="item" :preview-src-list="[item]"> </el-image>
              </el-carousel-item>
            </el-carousel>
          </div>
        </div>
        <div class="organizer">主办：{{ sponsor }}</div>
        <div class="undertake">承办：{{ undertake }}</div>
        <div class="time-box">时间：{{ time }}</div>
        <div class="text-introduce">
          <div class="title">相关介绍：</div>
          <div class="content">
            <p v-text="introduce"></p>
          </div>
        </div>
        <div class="panorama-box" v-show="panoramaShow">
          <div class="title">
            全景浏览
            <a href="javascript:void(0);" title="关闭">
              <img
                @click="(panoramaShow = false), (panoramaUrl = '')"
                class="close-box"
                src="/img/navicon/close.png"
                alt=""
              />
            </a>
          </div>
          <div class="content">
            <iframe
              style="width: 100%; height: 100%"
              :src="panoramaUrl"
              frameborder="0"
            ></iframe>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import { getWelcome } from "@/api/pc/public/specialmap";
import { mapGetters } from "vuex";
import { getWelcome } from '@/api/pc/public/specialmap'
import { mapGetters } from 'vuex'

export default {
  data() {
    return {
      time: "",
      sponsor: "",
      undertake: "",
      title: "",
      introduce: "",
      list: [],
      pathList: [],
      pointNameList: [],
      pointList: [],
      DC: null,
      pathLayer: null,
      pointLayer: null,
      panoramaUrlOne: "",
      panoramaUrl: "",
      audioSource: "",
      audioFlag: false,
      audioCourse: false,
      audioSynth: null,
      audioMsg: null,
      panoramaShow: false,
    };
  },
  created() {},
  mounted() {
    // console.log("显示", "see1");

    this.DC = global.DC;

    this.audioSynth = window.speechSynthesis;

    this.audioMsg = new window.SpeechSynthesisUtterance();

    this.audioMsg.onend = function () {
      // this.audioSynth.cancel();
      this.audioFlag = false;
      this.audioCourse = false;
    };
    this.getData();
  },
  computed: {
    ...mapGetters([
      "viewer",
      // 校区内导航的显示关闭
      "campusNavFlag",
      "orgNavBarFlag",
      "arcNavBarFlag",
    ]),
  },
  methods: {
    getData() {
      getWelcome({ hdname: "校区迎新" }).then((res) => {
        var result = res.data.data;
        this.title = result.hdname;
        this.time = result.time;
        this.sponsor = result.sponsor;
        this.undertake = result.undertake;
        this.panoramaUrl = result.panoramaurl;
        this.panoramaUrlOne = result.panoramaurl;
        this.introduce = result.context;
        this.audioSource = result.context;

        this.audioPlay();

        this.list = result.tpurl.split(",");
        this.pointNameList = result.addressname.split(",");
        this.pointList = result.address.split(";");

        var a = result.lx.split(";");

        a.forEach((item) => {
          var b = item.split("(");
          var c = b[1].substr(0, b[1].length - 1);
          var d = c.split(",");
          var j = [];
          d.forEach((it) => {
            var e = it.split(" ");
            var f = e.join(",");
            j.push(f);
          });
          var k = j.join(";");
          this.pathList.push(k);
        });

        this.pathLayer = new this.DC.VectorLayer("pathLayer");
        this.viewer.addLayer(this.pathLayer);

        this.pointLayer = new this.DC.HtmlLayer("pointLayer");
        this.viewer.addLayer(this.pointLayer);

        this.pathList.forEach((item) => {
          this.drawPolyline(item);
        });

        this.pointList.forEach((item, index) => {
          this.drawPoint(item.split(","), this.pointNameList[index]);
        });
        if (this.pointList.length > 0) {
          this.$store.dispatch("pcMoveView", {
            viewer: this.viewer,
            jd: +this.pointList[0].split(",")[0] - 0.0005,
            wd: this.pointList[0].split(",")[1],
          });
        } else {
          this.$store.dispatch("pcMoveView", {
            viewer: this.viewer,
            jd: +this.pathList[0].split(";")[0].split(",")[0] - 0.0005,
            wd: this.pathList[0].split(";")[0].split(",")[1],
          });
    data () {
        return {
            time: '',
            sponsor: '',
            undertake: '',
            title: '',
            introduce: '',
            list: [],
            pathList: [],
            pointNameList: [],
            pointList: [],
            pathLayer: null,
            pointLayer: null,
            panoramaUrlOne: '',
            panoramaUrl: '',
            audioSource: '',
            audioFlag: false,
            audioCourse: false,
            audioSynth: null,
            audioMsg: null,
            panoramaShow: false
        }
      });
    },
    drawPolyline(item) {
      const polyline = new this.DC.Polyline(item);
    created () { },
    mounted () {
        this.audioSynth = window.speechSynthesis

      polyline.setStyle({
        width: 6,
        arcType: true,
        material: new this.DC.PolylineImageTrailMaterialProperty({
          color: new this.DC.Color(255, 0, 0),
          speed: 60,
          image: "/img/icon/right.png",
          repeat: { x: 320, y: 1 },
        }),
        clampToGround: true,
      });
        this.audioMsg = new window.SpeechSynthesisUtterance()

      this.pathLayer.addOverlay(polyline);
        this.audioMsg.onend = function () {
            // this.audioSynth.cancel();
            this.audioFlag = false
            this.audioCourse = false
        }
        this.getData()
    },
    drawPoint(item, name) {
      const divIcon = new this.DC.DivIcon(
        new this.DC.Position(Number(item[0]), Number(item[1]), 0),
        `
    computed: {
        ...mapGetters([
            'viewer',
            // 校区内导航的显示关闭
            'campusNavFlag',
            'orgNavBarFlag',
            'arcNavBarFlag'
        ])
    },
    methods: {
        getData () {
            getWelcome({ hdname: '校区迎新' }).then((res) => {
                var result = res.data.data
                this.title = result.hdname
                this.time = result.time
                this.sponsor = result.sponsor
                this.undertake = result.undertake
                this.panoramaUrl = result.panoramaurl
                this.panoramaUrlOne = result.panoramaurl
                this.introduce = result.context
                this.audioSource = result.context

                this.audioPlay()

                this.list = result.tpurl.split(',')
                this.pointNameList = result.addressname.split(',')
                this.pointList = result.address.split(';')

                var a = result.lx.split(';')

                a.forEach((item) => {
                    var b = item.split('(')
                    var c = b[1].substr(0, b[1].length - 1)
                    var d = c.split(',')
                    var j = []
                    d.forEach((it) => {
                        var e = it.split(' ')
                        var f = e.join(',')
                        j.push(f)
                    })
                    var k = j.join(';')
                    this.pathList.push(k)
                })

                this.pathLayer = new global.DC.VectorLayer('pathLayer')
                this.viewer.addLayer(this.pathLayer)

                this.pointLayer = new global.DC.HtmlLayer('pointLayer')
                this.viewer.addLayer(this.pointLayer)

                this.pathList.forEach((item) => {
                    this.drawPolyline(item)
                })

                this.pointList.forEach((item, index) => {
                    this.drawPoint(item.split(','), this.pointNameList[index])
                })
                if (this.pointList.length > 0) {
                    this.$store.dispatch('pcMoveView', {
                        viewer: this.viewer,
                        jd: +this.pointList[0].split(',')[0] - 0.0005,
                        wd: this.pointList[0].split(',')[1]
                    })
                } else {
                    this.$store.dispatch('pcMoveView', {
                        viewer: this.viewer,
                        jd: +this.pathList[0].split(';')[0].split(',')[0] - 0.0005,
                        wd: this.pathList[0].split(';')[0].split(',')[1]
                    })
                }
            })
        },
        drawPolyline (item) {
            const polyline = new global.DC.Polyline(item)

            polyline.setStyle({
                width: 6,
                arcType: true,
                material: new global.DC.PolylineImageTrailMaterialProperty({
                    color: new global.DC.Color(255, 0, 0),
                    speed: 60,
                    image: '/img/icon/right.png',
                    repeat: { x: 320, y: 1 }
                }),
                clampToGround: true
            })

            this.pathLayer.addOverlay(polyline)
        },
        drawPoint (item, name) {
            const divIcon = new global.DC.DivIcon(
                new global.DC.Position(Number(item[0]), Number(item[1]), 0),
                `
                    <div class="point-entitys-box">
                        <div class="point-logo">
                            <img src="/img/icon/activity.png">
@@ -224,199 +214,63 @@
                        </div>
                    </div>
                `
      );
      this.pointLayer.addOverlay(divIcon);
    },
    audioPlay() {
      if (this.audioFlag == false) {
        this.audioMsg.text = this.audioSource;
        this.audioSynth.speak(this.audioMsg);
        this.audioFlag = true;
        this.audioCourse = true;
      } else {
        if (this.audioCourse == true) {
          this.audioSynth.pause();
          this.audioCourse = false;
        } else {
          this.audioSynth.resume();
          this.audioCourse = true;
            )
            this.pointLayer.addOverlay(divIcon)
        },
        audioPlay () {
            if (this.audioFlag == false) {
                this.audioMsg.text = this.audioSource
                this.audioSynth.speak(this.audioMsg)
                this.audioFlag = true
                this.audioCourse = true
            } else {
                if (this.audioCourse == true) {
                    this.audioSynth.pause()
                    this.audioCourse = false
                } else {
                    this.audioSynth.resume()
                    this.audioCourse = true
                }
            }
        },
        closeModel () {
            this.viewer.removeLayer(this.pathLayer)
            this.viewer.removeLayer(this.pointLayer)

            this.audioSynth.cancel()
            this.audioFlag = false
            this.audioCourse = false

            this.$store.dispatch('delVisitedViews', this.$route)
            this.$router.push('/pcLayout/default')
        },
        panoramaPlay () {
            this.panoramaShow = true
            this.panoramaUrl = this.panoramaUrlOne
        }
      }
    },
    closeModel() {
      this.viewer.removeLayer(this.pathLayer);
      this.viewer.removeLayer(this.pointLayer);

      this.audioSynth.cancel();
      this.audioFlag = false;
      this.audioCourse = false;

      this.$store.dispatch("delVisitedViews", this.$route);
      this.$router.push("/pcLayout/default");
    },
    panoramaPlay() {
      this.panoramaShow = true;
      this.panoramaUrl = this.panoramaUrlOne;
    },
  },
  destroyed() {
    // this.audioPlay();
    // console.log("关闭", "see1");
  },
};
    destroyed () {
        // this.audioPlay();
        // console.log("关闭", "see1");
    }
}
</script>

<style lang="scss" scope>
.welcome-container {
  padding: 10px;
  position: fixed;
  top: 132px;
  left: 132px;
  width: 480px;
  height: 720px;
  background: rgba(40, 187, 240, 0.7);
  border-radius: 10px;
  color: #fff;
  border: 1px solid #29baf1;
  box-shadow: 0 0 10px 2px #29baf1;
    padding: 10px;
    position: fixed;
    top: 132px;
    left: 132px;
    width: 480px;
    height: 720px;
    background: rgba(40, 187, 240, 0.7);
    border-radius: 10px;
    color: #fff;
    border: 1px solid #29baf1;
    box-shadow: 0 0 10px 2px #29baf1;

  .header {
    margin-bottom: 10px;
    height: 36px;
    line-height: 36px;
    text-align: center;
    position: relative;
    background: #29baf1;

    .title {
      .panorama-control {
        position: absolute;
        top: 0;
        right: 56px;
        bottom: 0;
        left: auto;
        margin: auto;
        width: 16px;
        height: 16px;
        cursor: pointer;
      }

      .audio-control {
        position: absolute;
        top: 0;
        right: 32px;
        bottom: 0;
        left: auto;
        margin: auto;
        width: 16px;
        height: 16px;
        cursor: pointer;
      }

      .close-box {
        position: absolute;
        top: 0;
        right: 8px;
        bottom: 0;
        left: auto;
        margin: auto;
        width: 16px;
        height: 16px;
        cursor: pointer;
      }
    }
  }

  .content-box {
    padding: 0 16px;
    height: calc(100% - 36px);

    & > div {
      margin-bottom: 10px;
    }

    & > div:last-child {
      margin-bottom: 0px;
    }

    .text-introduce {
      height: calc(100% - 458px);

      .title {
        position: relative;
        padding-left: 24px;
        height: 36px;
        line-height: 36px;

        &::before {
          position: absolute;
          top: 12px;
          left: 0;
          width: 0;
          height: 6px;
          border: 6px solid #fff;
          box-sizing: border-box;
          box-shadow: 0px 0px 4px 1px #fff;
          border-radius: 50%;
          content: "";
        }
      }

      .content {
        height: calc(100% - 36px);

        p {
          height: 100%;
          text-indent: 2em;
          font-size: 16px;
          letter-spacing: 2px;
          line-height: 24px;
          overflow-y: auto;
        }
      }
    }

    .organizer,
    .undertake,
    .time-box {
      padding-left: 24px;
      position: relative;

      height: 36px;
      line-height: 36px;

      &::before {
        position: absolute;
        top: 12px;
        left: 0px;
        width: 0;
        height: 6px;
        border: 6px solid #fff;
        box-sizing: border-box;
        box-shadow: 0px 0px 4px 1px #fff;
        border-radius: 50%;
        content: "";
      }
    }

    .panorama-box {
      padding: 10px;
      margin: auto !important;
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      z-index: 10;
      width: 560px;
      height: 406px;
      background: rgba(40, 187, 240, 0.7);
      border-radius: 10px;
      color: #fff;
      border: 1px solid #29baf1;
      box-shadow: 0 0 10px 2px #29baf1;

      .title {
    .header {
        margin-bottom: 10px;
        height: 36px;
        line-height: 36px;
@@ -424,81 +278,217 @@
        position: relative;
        background: #29baf1;

        .panorama-control {
          position: absolute;
          top: 0;
          right: 56px;
          bottom: 0;
          left: auto;
          margin: auto;
          width: 16px;
          height: 16px;
          cursor: pointer;
        }
        .title {
            .panorama-control {
                position: absolute;
                top: 0;
                right: 56px;
                bottom: 0;
                left: auto;
                margin: auto;
                width: 16px;
                height: 16px;
                cursor: pointer;
            }

        .audio-control {
          position: absolute;
          top: 0;
          right: 32px;
          bottom: 0;
          left: auto;
          margin: auto;
          width: 16px;
          height: 16px;
          cursor: pointer;
        }
            .audio-control {
                position: absolute;
                top: 0;
                right: 32px;
                bottom: 0;
                left: auto;
                margin: auto;
                width: 16px;
                height: 16px;
                cursor: pointer;
            }

        .close-box {
          position: absolute;
          top: 0;
          right: 8px;
          bottom: 0;
          left: auto;
          margin: auto;
          width: 16px;
          height: 16px;
          cursor: pointer;
            .close-box {
                position: absolute;
                top: 0;
                right: 8px;
                bottom: 0;
                left: auto;
                margin: auto;
                width: 16px;
                height: 16px;
                cursor: pointer;
            }
        }
      }

      .content {
        padding: 0 10px;
        height: calc(100% - 46px);

        .iframe {
          width: 100%;
          height: 100%;
        }
      }
    }

    .img-exhibition {
      height: 300px;
    .content-box {
        padding: 0 16px;
        height: calc(100% - 36px);

      .content {
        .el-image {
          position: absolute;
          top: 0;
          left: 0;
          right: 0;
          bottom: 0;
          margin: auto;
          // width: 100%;
          height: 100%;
        & > div {
            margin-bottom: 10px;
        }

          img {
            position: absolute;
        & > div:last-child {
            margin-bottom: 0px;
        }

        .text-introduce {
            height: calc(100% - 458px);

            .title {
                position: relative;
                padding-left: 24px;
                height: 36px;
                line-height: 36px;

                &::before {
                    position: absolute;
                    top: 12px;
                    left: 0;
                    width: 0;
                    height: 6px;
                    border: 6px solid #fff;
                    box-sizing: border-box;
                    box-shadow: 0px 0px 4px 1px #fff;
                    border-radius: 50%;
                    content: '';
                }
            }

            .content {
                height: calc(100% - 36px);

                p {
                    height: 100%;
                    text-indent: 2em;
                    font-size: 16px;
                    letter-spacing: 2px;
                    line-height: 24px;
                    overflow-y: auto;
                }
            }
        }

        .organizer,
        .undertake,
        .time-box {
            padding-left: 24px;
            position: relative;

            height: 36px;
            line-height: 36px;

            &::before {
                position: absolute;
                top: 12px;
                left: 0px;
                width: 0;
                height: 6px;
                border: 6px solid #fff;
                box-sizing: border-box;
                box-shadow: 0px 0px 4px 1px #fff;
                border-radius: 50%;
                content: '';
            }
        }

        .panorama-box {
            padding: 10px;
            margin: auto !important;
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            margin: auto;
            width: 100%;
            height: 100%;
          }
            z-index: 10;
            width: 560px;
            height: 406px;
            background: rgba(40, 187, 240, 0.7);
            border-radius: 10px;
            color: #fff;
            border: 1px solid #29baf1;
            box-shadow: 0 0 10px 2px #29baf1;

            .title {
                margin-bottom: 10px;
                height: 36px;
                line-height: 36px;
                text-align: center;
                position: relative;
                background: #29baf1;

                .panorama-control {
                    position: absolute;
                    top: 0;
                    right: 56px;
                    bottom: 0;
                    left: auto;
                    margin: auto;
                    width: 16px;
                    height: 16px;
                    cursor: pointer;
                }

                .audio-control {
                    position: absolute;
                    top: 0;
                    right: 32px;
                    bottom: 0;
                    left: auto;
                    margin: auto;
                    width: 16px;
                    height: 16px;
                    cursor: pointer;
                }

                .close-box {
                    position: absolute;
                    top: 0;
                    right: 8px;
                    bottom: 0;
                    left: auto;
                    margin: auto;
                    width: 16px;
                    height: 16px;
                    cursor: pointer;
                }
            }

            .content {
                padding: 0 10px;
                height: calc(100% - 46px);

                .iframe {
                    width: 100%;
                    height: 100%;
                }
            }
        }
      }

        .img-exhibition {
            height: 300px;

            .content {
                .el-image {
                    position: absolute;
                    top: 0;
                    left: 0;
                    right: 0;
                    bottom: 0;
                    margin: auto;
                    // width: 100%;
                    height: 100%;

                    img {
                        position: absolute;
                        top: 0;
                        left: 0;
                        right: 0;
                        bottom: 0;
                        margin: auto;
                        width: 100%;
                        height: 100%;
                    }
                }
            }
        }
    }
  }
}
</style>

 src/pcviews/tool/layer-manage.vue

@@ -31,7 +31,6 @@
export default {
    data () {
        return {
            DC: null,
            signList: [{ flag: true }],
            destroyedFlag: true
        }
@@ -54,20 +53,19 @@

        addSign () {
            var that = this
            that.DC = global.DC

            that.viewer.on(that.DC.MouseEventType.MOUSE_MOVE, (e) => that.moveMessage(e, '点击确认标注位置'))
            that.viewer.on(global.DC.MouseEventType.MOUSE_MOVE, (e) => that.moveMessage(e, '点击确认标注位置'))

            that.viewer.once(that.DC.MouseEventType.CLICK, (e) => {
            that.viewer.once(global.DC.MouseEventType.CLICK, (e) => {
                if (that.destroyedFlag == false) return

                that.viewer.on(that.DC.MouseEventType.MOUSE_MOVE, (e) => that.moveMessage(e, ''))
                that.viewer.on(global.DC.MouseEventType.MOUSE_MOVE, (e) => that.moveMessage(e, ''))

                // eslint-disable-next-line no-unused-vars
                var popup = new this.DC.DivForms(this.viewer, {
                var popup = new global.DC.DivForms(this.viewer, {
                    domId: 'AddTagBox',
                    position: [that.DC.Transform.transformWGS84ToCartesian(
                        new that.DC.Position(
                    position: [global.DC.Transform.transformWGS84ToCartesian(
                        new global.DC.Position(
                            Number(
                                e.wgs84SurfacePosition.lng
                            ),
@@ -94,7 +92,7 @@
    destroyed () {
        var that = this
        that.destroyedFlag = false
        that.viewer.on(that.DC.MouseEventType.MOUSE_MOVE, (e) => that.moveMessage(e, ''))
        that.viewer.on(global.DC.MouseEventType.MOUSE_MOVE, (e) => that.moveMessage(e, ''))
    }
}
</script>

 src/pcviews/tool/sign.vue

@@ -39,7 +39,6 @@
export default {
    data () {
        return {
            DC: null,
            signList: [],
            destroyedFlag: true
        }
@@ -127,26 +126,25 @@

        addSign () {
            var that = this
            that.DC = global.DC
            this.$store.commit('set_closeMapClick', true)
            // console.log("开始", "see");
            that.viewer.on(that.DC.MouseEventType.MOUSE_MOVE, (e) =>
            that.viewer.on(global.DC.MouseEventType.MOUSE_MOVE, (e) =>
                that.moveMessage(e, '点击确认标注位置')
            )

            that.viewer.once(that.DC.MouseEventType.CLICK, (e) => {
            that.viewer.once(global.DC.MouseEventType.CLICK, (e) => {
                if (that.destroyedFlag == false) return

                that.viewer.on(that.DC.MouseEventType.MOUSE_MOVE, (e) =>
                that.viewer.on(global.DC.MouseEventType.MOUSE_MOVE, (e) =>
                    that.moveMessage(e, '')
                )

                // eslint-disable-next-line no-unused-vars
                const popup = new this.DC.DivForms(this.viewer, {
                const popup = new global.DC.DivForms(this.viewer, {
                    domId: 'AddTagBox',
                    position: [
                        that.DC.Transform.transformWGS84ToCartesian(
                            new that.DC.Position(
                        global.DC.Transform.transformWGS84ToCartesian(
                            new global.DC.Position(
                                Number(e.wgs84SurfacePosition.lng),
                                Number(e.wgs84SurfacePosition.lat),
                                Number(e.wgs84SurfacePosition.alt)
@@ -169,8 +167,8 @@
    destroyed () {
        var that = this
        that.destroyedFlag = false
        if (that.DC) {
            that.viewer.on(that.DC.MouseEventType.MOUSE_MOVE, (e) =>
        if (global.DC) {
            that.viewer.on(global.DC.MouseEventType.MOUSE_MOVE, (e) =>
                that.moveMessage(e, '')
            )
        }