.

shuishen

2022-03-08 4af47e6507183a18f676d9fcabc122084546f37e

.

 src/components/map/components/dimension.vue

@@ -102,52 +102,52 @@
                        )
                    )

                    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.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',
                    //     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.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',
                    //     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 global.DC.Namespace.Cesium.Color()

 src/components/map/index.vue

@@ -246,26 +246,20 @@
            })

            eagleViewer.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',
                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
                })
            )

            eagleViewer.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',
                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
                })

 src/components/mobileCortrol/index.vue

@@ -1,127 +1,123 @@
<template>
  <div class="m-left-control">
    <div class="m-l-inbut zoom-in" @click="zoomIn()">
      <i class="el-icon-refresh"></i>
    </div>
    <!-- <div
    <div class="m-left-control">
        <div class="m-l-inbut zoom-in" @click="zoomIn()">
            <i class="el-icon-refresh"></i>
        </div>
        <!-- <div
      class="m-l-inbut zoom-in m-l-inbut-2d"
      :class="{ active: dimension == '3D' }"
      @click="zoomIn('3D')"
    >
      3&nbsp;&nbsp;维
    </div> -->
    <div
      class="m-l-inbut zoom-in m-l-inbut-3d"
      :class="{ active: dimension == '2.5D' }"
      @click="zoomIn('2.5D')"
    >
      3D
        </div>-->
        <div
            class="m-l-inbut zoom-in m-l-inbut-3d"
            :class="{ active: dimension == '2.5D' }"
            @click="zoomIn('2.5D')"
        >3D</div>
    </div>
  </div>
</template>

<script>
import { mapGetters } from "vuex";
import { mapGetters } from 'vuex'
export default {
  name: "mobileCortrol",
  data() {
    return {
      DC: "",
    };
  },
  computed: {
    ...mapGetters(["mviewer", "startPointFn", "dimension"]),
  },
  created() {
    this.DC = global.DC;
  },
  methods: {
    zoomIn(val) {
      // this.$store.dispatch("mapFlyTo", {
      //   //飞入
      //   lntLat: [115.87988885, 28.72502592, 2100],
      //   // lntLat: [115.87186406, 28.74449337, 1200],
      //   // lntLat: [121.50492752204283, 31.21567802276832, 2530],
      //   heading: 0,
      //   pitch: -45,
      //   roll: 0,
      //   noOpen: true,
      // });
      if (val) {
        if (this.dimension != val) {
          this.$store.dispatch("MSET_DIMENSIONS", val);
    name: 'mobileCortrol',
    data () {
        return {
        }
        return;
      }
      this.startPointFn();
    },
  },
};
    computed: {
        ...mapGetters(['mviewer', 'startPointFn', 'dimension'])
    },
    created () {
    },
    methods: {
        zoomIn (val) {
            // this.$store.dispatch("mapFlyTo", {
            //   //飞入
            //   lntLat: [115.87988885, 28.72502592, 2100],
            //   // lntLat: [115.87186406, 28.74449337, 1200],
            //   // lntLat: [121.50492752204283, 31.21567802276832, 2530],
            //   heading: 0,
            //   pitch: -45,
            //   roll: 0,
            //   noOpen: true,
            // });
            if (val) {
                if (this.dimension != val) {
                    this.$store.dispatch('MSET_DIMENSIONS', val)
                }
                return
            }
            this.startPointFn()
        }
    }
}
</script>

<style scoped lang="scss">
.m-left-control {
  position: fixed;
  left: 20px;
  top: 93px;
  height: 10px;
  z-index: 20 !important;
  .m-l-inbut {
    width: 35px;
    height: 35px;
    background-color: rgb(33, 150, 243);
    // background-color: white;
    // stroke-width: 10;
    // stroke: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 22px;
    margin-bottom: 12px;
    border-radius: 5px;
  }
  .m-l-inbut-2d {
    position: relative;
    background-color: white;
    top: 60px;
    font-size: 12px;
    color: #000;
    border: 1px solid #a4d1ff;
    border-radius: 5px 5px 0 0;
    // box-shadow: 0px 0px 10px #409eff inset;
    // &:hover {
    //   background-color: rgb(21, 136, 230);
    //   box-shadow: -2px -2px 3px rgb(3, 74, 136) inset;
    // }
  }
  .m-l-inbut-3d {
    @extend .m-l-inbut-2d;
    top: 45px;
    border-radius: 0 0 5px 5px;
  }
    position: fixed;
    left: 20px;
    top: 93px;
    height: 10px;
    z-index: 20 !important;
    .m-l-inbut {
        width: 35px;
        height: 35px;
        background-color: rgb(33, 150, 243);
        // background-color: white;
        // stroke-width: 10;
        // stroke: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        color: white;
        font-size: 22px;
        margin-bottom: 12px;
        border-radius: 5px;
    }
    .m-l-inbut-2d {
        position: relative;
        background-color: white;
        top: 60px;
        font-size: 12px;
        color: #000;
        border: 1px solid #a4d1ff;
        border-radius: 5px 5px 0 0;
        // box-shadow: 0px 0px 10px #409eff inset;
        // &:hover {
        //   background-color: rgb(21, 136, 230);
        //   box-shadow: -2px -2px 3px rgb(3, 74, 136) inset;
        // }
    }
    .m-l-inbut-3d {
        @extend .m-l-inbut-2d;
        top: 45px;
        border-radius: 0 0 5px 5px;
    }

  .active {
    background-color: #409eff;
    border: 1px solid #409eff;
    color: #fff;
    border-radius: 5px;
    z-index: 10;
    // box-shadow: -4px -4px 10px rgb(13, 98, 167) inset;
    // color: rgb(0, 0, 0);
    // box-shadow: -4px -4px 10px rgb(13, 98, 167) inset;
    transform: translateY(1px);
    // position: relative;
    // &::before {
    //   top: 1px;
    //   left: 1px;
    //   position: absolute;
    //   content: "";
    //   width: 100%;
    //   height: 100%;
    //   box-shadow: -2px -2px 15px rgb(4, 95, 170) inset;
    //   // border: 1px solid rgb(14, 54, 87);
    // }
  }
    .active {
        background-color: #409eff;
        border: 1px solid #409eff;
        color: #fff;
        border-radius: 5px;
        z-index: 10;
        // box-shadow: -4px -4px 10px rgb(13, 98, 167) inset;
        // color: rgb(0, 0, 0);
        // box-shadow: -4px -4px 10px rgb(13, 98, 167) inset;
        transform: translateY(1px);
        // position: relative;
        // &::before {
        //   top: 1px;
        //   left: 1px;
        //   position: absolute;
        //   content: "";
        //   width: 100%;
        //   height: 100%;
        //   box-shadow: -2px -2px 15px rgb(4, 95, 170) inset;
        //   // border: 1px solid rgb(14, 54, 87);
        // }
    }
}
</style>

 src/components/mobileCortrolButtom/index.vue

@@ -1,210 +1,207 @@
<template>
  <div class="m-left-mobileCortrolButtom">
    <!-- <div class="m-l-inbut" @click="mubiao"><i class="el-icon-s-help"></i></div> -->
    <div class="m-l-inbut" v-show="false">
      <!-- <i class="el-icon-s-flag"></i> -->
      <el-dropdown trigger="click" @command="handleCommand">
        <span class="el-dropdown-link icons">
          <i class="el-icon-s-flag icon"></i>
        </span>
        <el-dropdown-menu slot="dropdown">
          <el-dropdown-item
            v-for="(item, index) in tabTable"
            :key="index"
            :command="item"
            >{{ item.title }}</el-dropdown-item
          >
        </el-dropdown-menu>
      </el-dropdown>
    </div>
    <div class="m-l-inbut" @click="openBigPopupAfter">
      <i class="el-icon-menu"></i>
    </div>
    <!-- <div class="m-l-inbut" @click="openActivity">
    <div class="m-left-mobileCortrolButtom">
        <!-- <div class="m-l-inbut" @click="mubiao"><i class="el-icon-s-help"></i></div> -->
        <div class="m-l-inbut" v-show="false">
            <!-- <i class="el-icon-s-flag"></i> -->
            <el-dropdown trigger="click" @command="handleCommand">
                <span class="el-dropdown-link icons">
                    <i class="el-icon-s-flag icon"></i>
                </span>
                <el-dropdown-menu slot="dropdown">
                    <el-dropdown-item
                        v-for="(item, index) in tabTable"
                        :key="index"
                        :command="item"
                    >{{ item.title }}</el-dropdown-item>
                </el-dropdown-menu>
            </el-dropdown>
        </div>
        <div class="m-l-inbut" @click="openBigPopupAfter">
            <i class="el-icon-menu"></i>
        </div>
        <!-- <div class="m-l-inbut" @click="openActivity">
      <i class="el-icon-s-opportunity"></i>
    </div> -->
    <!-- <div class="m-l-inbut" @click="goOn"><i class="el-icon-location"></i></div> -->
  </div>
        </div>-->
        <!-- <div class="m-l-inbut" @click="goOn"><i class="el-icon-location"></i></div> -->
    </div>
</template>

<script>
import { mapGetters } from "vuex";
import { getIp, getUsers } from "@/api/mobile/ip/index";
import { getListarc } from "@/api/mobile/public/arc";
import { getActivity } from "@/api/mobile/hd/hd";
import { mapGetters } from 'vuex'
import { getIp, getUsers } from '@/api/mobile/ip/index'
import { getListarc } from '@/api/mobile/public/arc'
import { getActivity } from '@/api/mobile/hd/hd'
export default {
  name: "mobileCortrolButtom",
  data() {
    return {
      DC: "",
      tabTable: [],
      ccData: [
        {
          lnt: 114.03835559,
          lat: 27.63057034,
        },
        {
          lnt: 114.03971446,
          lat: 27.62986481,
        },
        {
          lnt: 114.03841654,
          lat: 27.62919726,
        },
        {
          lnt: 114.039946,
          lat: 27.62847544,
        },
      ],
    };
  },
  computed: {
    ...mapGetters(["mviewer", "openmobileGoTo", "dimensionData"]),
  },
  created() {
    this.DC = global.DC;
    // this.getStreet();
  },
  mounted() {},
  methods: {
    openActivity() {
      let d = {
        main: [
          {
            name: "活动",
            type: 1,
            method: getActivity,
          },
        ],
        qurey: "活动",
      };
      this.$store.commit("MSET_POPUPOUROPENDATA", d);
      this.$store.commit("MSET_BIGPOPUP", { name: "活动" });
      // this.$store.commit("set_showActivity", true);
    },
    mubiao() {
      let that = this;
      //测试fllyTo
    },
    handleCommand(command) {
      let that = this;
      let position = [+command.lnt + 0.00027, +command.lat + 0.00048, 450];
      console.log(command, "定位");
      // 定位
      // this.$store.commit("MSETCC_SETCC", {
      //   lntLat: position,
      // });
      // this.$store.dispatch("mapFlyTo", {
      //   //飞入
      //   lntLat: [...position, 450],
      //   heading: 0,
      //   pitch: -90,
      //   roll: 0,
      //   noOpen: true,
      // });
      that.mviewer.camera.setView({
        // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
        // fromDegrees()方法，将经纬度和高程转换为世界坐标
        destination: new global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
          // 114.0351,
          // 27.6314,
          // 200.0
          position[0],
          position[1],
          position[2]
        ),
        orientation: {
          heading: global.DC.Namespace.Cesium.Math.toRadians(
            that.dimensionData.heading
          ),
          pitch: global.DC.Namespace.Cesium.Math.toRadians(
            that.dimensionData.pitch
          ),
          // heading: data.heading,
          // pitch: data.pitch,
          roll: that.dimensionData.roll,
        },
      });
    },
    openBigPopupAfter() {
      this.$store.commit("MSET_BIGPOPUPAFTER", true);
    },
    goOn() {
      let that = this;
      this.$store.commit("MSET_OPENMOBILEGOTO", !that.openmobileGoTo);
      // console.log(returnCitySN["cip"]);
      // let data = {
      //   ip: returnCitySN["cip"],
      //   key: "7WKBZ-QDY62-WEEUG-C7KUN-ADAF5-L5BKZ",
      // };
      // console.log("定位", data.ip);
      // getIp(data).then((res) => {
      //   // getUsers(data).then((res) => {
      //   console.log(res);
      // });
    },
    getStreet() {
      let that = this;
      getListarc().then((res) => {
        let title = [];
        const data = res.data.data;
        for (let k = 0; k < data.length; k++) {
          title.push({
            title: data[k].dictValue,
            flag: false,
            key: data[k].dictKey,
            child: [],
            lnt: that.ccData[k].lnt,
            lat: that.ccData[k].lat,
          });
    name: 'mobileCortrolButtom',
    data () {
        return {
            tabTable: [],
            ccData: [
                {
                    lnt: 114.03835559,
                    lat: 27.63057034
                },
                {
                    lnt: 114.03971446,
                    lat: 27.62986481
                },
                {
                    lnt: 114.03841654,
                    lat: 27.62919726
                },
                {
                    lnt: 114.039946,
                    lat: 27.62847544
                }
            ]
        }
        // res.data.data.forEach((item) => {
        //   title.push({
        //     title: item.dictValue,
        //     flag: false,
        //     key: item.dictKey,
        //     child: [],
        //   });
        // });
        this.tabTable = title;
        this.$store.commit("MSET_POPUPTABLENAME", title);
      });
    },
  },
};
    computed: {
        ...mapGetters(['mviewer', 'openmobileGoTo', 'dimensionData'])
    },
    created () {
        // this.getStreet();
    },
    mounted () { },
    methods: {
        openActivity () {
            const d = {
                main: [
                    {
                        name: '活动',
                        type: 1,
                        method: getActivity
                    }
                ],
                qurey: '活动'
            }
            this.$store.commit('MSET_POPUPOUROPENDATA', d)
            this.$store.commit('MSET_BIGPOPUP', { name: '活动' })
            // this.$store.commit("set_showActivity", true);
        },
        mubiao () {
            // 测试fllyTo
        },
        handleCommand (command) {
            const that = this
            const position = [+command.lnt + 0.00027, +command.lat + 0.00048, 450]
            console.log(command, '定位')
            // 定位
            // this.$store.commit("MSETCC_SETCC", {
            //   lntLat: position,
            // });
            // this.$store.dispatch("mapFlyTo", {
            //   //飞入
            //   lntLat: [...position, 450],
            //   heading: 0,
            //   pitch: -90,
            //   roll: 0,
            //   noOpen: true,
            // });
            that.mviewer.camera.setView({
                // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
                // fromDegrees()方法，将经纬度和高程转换为世界坐标
                // eslint-disable-next-line new-cap
                destination: new global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
                    // 114.0351,
                    // 27.6314,
                    // 200.0
                    position[0],
                    position[1],
                    position[2]
                ),
                orientation: {
                    heading: global.DC.Namespace.Cesium.Math.toRadians(
                        that.dimensionData.heading
                    ),
                    pitch: global.DC.Namespace.Cesium.Math.toRadians(
                        that.dimensionData.pitch
                    ),
                    // heading: data.heading,
                    // pitch: data.pitch,
                    roll: that.dimensionData.roll
                }
            })
        },
        openBigPopupAfter () {
            this.$store.commit('MSET_BIGPOPUPAFTER', true)
        },
        goOn () {
            const that = this
            this.$store.commit('MSET_OPENMOBILEGOTO', !that.openmobileGoTo)
            // console.log(returnCitySN["cip"]);
            // let data = {
            //   ip: returnCitySN["cip"],
            //   key: "7WKBZ-QDY62-WEEUG-C7KUN-ADAF5-L5BKZ",
            // };
            // console.log("定位", data.ip);
            // getIp(data).then((res) => {
            //   // getUsers(data).then((res) => {
            //   console.log(res);
            // });
        },
        getStreet () {
            const that = this
            getListarc().then((res) => {
                const title = []
                const data = res.data.data
                for (let k = 0; k < data.length; k++) {
                    title.push({
                        title: data[k].dictValue,
                        flag: false,
                        key: data[k].dictKey,
                        child: [],
                        lnt: that.ccData[k].lnt,
                        lat: that.ccData[k].lat
                    })
                }
                // res.data.data.forEach((item) => {
                //   title.push({
                //     title: item.dictValue,
                //     flag: false,
                //     key: item.dictKey,
                //     child: [],
                //   });
                // });
                this.tabTable = title
                this.$store.commit('MSET_POPUPTABLENAME', title)
            })
        }
    }
}
</script>

<style scoped lang="scss">
.m-left-mobileCortrolButtom {
  position: fixed;
  bottom: 35px;
  left: 20px;
  z-index: 200;
  .m-l-inbut {
    float: left;
    width: 39px;
    height: 39px;
    background-color: rgb(33, 150, 243);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 32px;
    margin-left: 12px;
    border-radius: 5px;
    .icons {
      display: inline-block;
      width: 100%;
      height: 100%;
    position: fixed;
    bottom: 35px;
    left: 20px;
    z-index: 200;
    .m-l-inbut {
        float: left;
        width: 39px;
        height: 39px;
        background-color: rgb(33, 150, 243);
        display: flex;
        align-items: center;
        justify-content: center;
        color: white;
        font-size: 32px;
        margin-left: 12px;
        border-radius: 5px;
        .icons {
            display: inline-block;
            width: 100%;
            height: 100%;
        }
        .icon {
            font-size: 32px;
            color: #fff;
            &::before {
                width: 100%;
                height: 100%;
            }
        }
    }
    .icon {
      font-size: 32px;
      color: #fff;
      &::before {
        width: 100%;
        height: 100%;
      }
    }
  }
}
</style>

 src/components/mobileCortrolSearch/index.vue

@@ -1,86 +1,83 @@
<template>
  <div class="m-left-mobileCortrolSearch">
    <div class="m-left-SearchMain">
      <el-input
        placeholder="请输入内容"
        v-model="input"
        clearable
        size="small"
        class="m-left-S-input"
      >
        <el-button
          slot="append"
          class="iconSearch"
          icon="el-icon-search icon"
          @click="search"
        >
        </el-button>
      </el-input>
    <div class="m-left-mobileCortrolSearch">
        <div class="m-left-SearchMain">
            <el-input
                placeholder="请输入内容"
                v-model="input"
                clearable
                size="small"
                class="m-left-S-input"
            >
                <el-button
                    slot="append"
                    class="iconSearch"
                    icon="el-icon-search icon"
                    @click="search"
                ></el-button>
            </el-input>
        </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "mobileCortrolSearch",
  computed: {},
  data() {
    return {
      viewer: null,
      DC: null,
      input: "",
    };
  },
  created() {
    this.DC = global.DC;
  },
  mounted() {},
  methods: {
    initialize(viewer) {
      viewer.scene.globe.depthTestAgainstTerrain = false;
      this.viewer = viewer;
    name: 'mobileCortrolSearch',
    computed: {},
    data () {
        return {
            viewer: null,
            input: ''
        }
    },
    search() {
      let that = this;
      this.$store.commit("MSET_BIGPOPUP", { search: true, value: that.input });
      that.input = "";
    created () {
    },
  },
};
    mounted () { },
    methods: {
        initialize (viewer) {
            viewer.scene.globe.depthTestAgainstTerrain = false
            this.viewer = viewer
        },
        search () {
            const that = this
            this.$store.commit('MSET_BIGPOPUP', { search: true, value: that.input })
            that.input = ''
        }
    }
}
</script>

<style scoped lang="scss">
.m-left-mobileCortrolSearch {
  width: 100%;
  position: fixed;
  top: 0;
  // left: 20px;
  z-index: 200;
  .m-left-SearchMain {
    margin: 0 auto;
    width: 60%;
    position: relative;
    z-index: 1;
    top: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    .m-left-S-input {
      border: none;
      font-size: 16px;
    width: 100%;
    position: fixed;
    top: 0;
    // left: 20px;
    z-index: 200;
    .m-left-SearchMain {
        margin: 0 auto;
        width: 60%;
        position: relative;
        z-index: 1;
        top: 20px;
        display: flex;
        align-items: center;
        justify-content: center;
        .m-left-S-input {
            border: none;
            font-size: 16px;
        }
        .iconSearch {
            width: 30px;
            height: 30px;
            padding-top: 0;
            padding-bottom: 0;
            background-color: rgb(33, 150, 243);
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 24px;
            color: #fff;
        }
    }
    .iconSearch {
      width: 30px;
      height: 30px;
      padding-top: 0;
      padding-bottom: 0;
      background-color: rgb(33, 150, 243);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 24px;
      color: #fff;
    }
  }
}
</style>

 src/components/mobileLeftNav/index.vue

@@ -1,294 +1,292 @@
<template>
  <div :class="['m-left-nav', seeRight ? '' : 'nones']" :style="[navStyle]">
    <!-- :style="[coutrolStyle]" -->
    <div class="m-left-coutrol" @click="changeIconHide">
      <i :class="icons"></i>
    <div :class="['m-left-nav', seeRight ? '' : 'nones']" :style="[navStyle]">
        <!-- :style="[coutrolStyle]" -->
        <div class="m-left-coutrol" @click="changeIconHide">
            <i :class="icons"></i>
        </div>
        <ul>
            <li
                v-for="(item, index) in leftNavData"
                :key="index"
                @click="leftNavClick(item)"
                v-show="!item.notShow"
            >
                <img :style="[imgStyle]" :src="item.img" alt />
                <span>{{ item.label }}</span>
            </li>
        </ul>
    </div>
    <ul>
      <li
        v-for="(item, index) in leftNavData"
        :key="index"
        @click="leftNavClick(item)"
        v-show="!item.notShow"
      >
        <img :style="[imgStyle]" :src="item.img" alt="" />
        <span>{{ item.label }}</span>
      </li>
    </ul>
  </div>
</template>

<script>
import { mapGetters } from "vuex";
import { mapGetters } from 'vuex'
import {
  // getListdoor, //出入
  // getListaed, //AED
  // getListparking, //停车场
  getListarchitecture, //全景
  getListarchitecture1, //标签
  getListroad, //道路
  getListcat, //出入-AED-停车场
} from "@/api/mobile/piont/index";
import { getListVideo } from "@/api/mobile/monitor/index";
    // getListdoor, //出入
    // getListaed, //AED
    // getListparking, //停车场
    getListarchitecture, // 全景
    getListarchitecture1, // 标签
    getListroad, // 道路
    getListcat // 出入-AED-停车场
} from '@/api/mobile/piont/index'
import { getListVideo } from '@/api/mobile/monitor/index'
export default {
  name: "mobileLeftNav",
  watch: {
    iconHide() {
      if (this.iconHide) {
        this.icons = "el-icon-d-arrow-left";
        this.navStyle.right = "-51px";
        this.imgStyle.right = "6px";
      } else {
        this.icons = "el-icon-d-arrow-right";
        this.navStyle.right = "0px";
        this.imgStyle.right = "0";
      }
    },
    seeRight() {
      if (this.seeRight) {
        this.leftNavData[0].flag = false;
        this.leftNavData[0].img = this.leftNavData[0].checked;
        this[this.leftNavData[0].layer].show = true;
      } else {
        let lnd = this.leftNavData;
        for (let k in lnd) {
          if (this[this.leftNavData[k].layer]._show) {
            // console.log(lnd[k].label, "所有开启");
            this.leftNavData[k].flag = false;
            this.leftNavData[k].img = this.leftNavData[k].normal;
            this[this.leftNavData[k].layer].show = false;
          }
    name: 'mobileLeftNav',
    watch: {
        iconHide () {
            if (this.iconHide) {
                this.icons = 'el-icon-d-arrow-left'
                this.navStyle.right = '-51px'
                this.imgStyle.right = '6px'
            } else {
                this.icons = 'el-icon-d-arrow-right'
                this.navStyle.right = '0px'
                this.imgStyle.right = '0'
            }
        },
        seeRight () {
            if (this.seeRight) {
                this.leftNavData[0].flag = false
                this.leftNavData[0].img = this.leftNavData[0].checked
                this[this.leftNavData[0].layer].show = true
            } else {
                const lnd = this.leftNavData
                for (const k in lnd) {
                    if (this[this.leftNavData[k].layer]._show) {
                        // console.log(lnd[k].label, "所有开启");
                        this.leftNavData[k].flag = false
                        this.leftNavData[k].img = this.leftNavData[k].normal
                        this[this.leftNavData[k].layer].show = false
                    }
                }
            }
        }
      }
    },
  },
  computed: {
    ...mapGetters(["iconHide", "dimensionData", "seeRight"]),
  },
  data() {
    return {
      icons: "el-icon-d-arrow-right",
      navStyle: {
        right: "0px",
      },
      imgStyle: {
        right: "0",
      },
      leftNavData: [
        {
          flag: true,
          label: "标签",
          // img: "/img/leftnav/tag.png",
          img: "/img/leftnav/tag-checked.png",
          normal: "/img/leftnav/tag.png",
          checked: "/img/leftnav/tag-checked.png",
          layer: "tagLayer",
          methods: getListarchitecture1,
          imgSrc: "https://map.hit.edu.cn/images/tarrow_xq.png",
          // imgSrc: "img/mobile/pink.png",
        },
        {
          flag: false,
          label: "道路",
          img: "/img/leftnav/way.png",
          normal: "/img/leftnav/way.png",
          checked: "/img/leftnav/way-checked.png",
          layer: "wayLayer",
          methods: getListroad,
          imgSrc: "img/mobile/green.png",
        },
        {
          flag: false,
          label: "实景",
          img: "/img/leftnav/scene.png",
          normal: "/img/leftnav/scene.png",
          checked: "/img/leftnav/scene-checked.png",
          layer: "sceneLayer",
          methods: getListarchitecture,
          imgSrc: "img/leftnav/map-panorama.png",
          // imgSrc: "img/mobile/blue.png",
        },
        {
          flag: false,
          label: "监控",
          img: "/img/leftnav/monitor.png",
          normal: "/img/leftnav/monitor.png",
          checked: "/img/leftnav/monitor-checked.png",
          layer: "videoLayer",
          methods: getListVideo,
          imgSrc: "/img/leftnav/map-monitor.png",
          // imgSrc: "img/mobile/blue.png",
        },
        // {
        //   flag: false,
        //   label: "活动",
        //   img: "/img/leftnav/activity.png",
        //   normal: "/img/leftnav/activity.png",
        //   checked: "/img/leftnav/activity-checked.png",
        //   layer: "activityLayer",
        //   methods: getListdoor,
        //   imgSrc: "img/mobile/brown.png",
        // },
        {
          flag: false,
          label: "AED",
          img: "/img/leftnav/aed.png",
          normal: "/img/leftnav/aed.png",
          checked: "/img/leftnav/aed-checked.png",
          layer: "aedLayer",
          methods: getListcat,
          type: 9,
          imgSrc: "img/leftnav/map-aed.png",
          // imgSrc: "img/mobile/pink.png",
          notShow: true,
        },
        {
          flag: false,
          label: "停车",
          img: "/img/leftnav/park.png",
          normal: "/img/leftnav/park.png",
          checked: "/img/leftnav/park-checked.png",
          layer: "parkLayer",
          methods: getListcat,
          type: 11,
          imgSrc: "https://map.hit.edu.cn/images/p-biao.png",
          // imgSrc: "img/mobile/popcorn.png",
        },
        {
          flag: false,
          label: "出入",
          img: "/img/leftnav/come.png",
          normal: "/img/leftnav/come.png",
          checked: "/img/leftnav/come-checked.png",
          layer: "comeLayer",
          methods: getListcat,
          type: 12,
          imgSrc: "img/leftnav/map-activity.png",
          // imgSrc: "img/mobile/purple.png",
        },
      ],
      viewer: null,
      DC: null,
      tagLayer: null,
      wayLayer: null,
      sceneLayer: null,
      videoLayer: null,
      activityLayer: null,
      aedLayer: null,
      parkLayer: null,
      comeLayer: null,
    };
  },
  created() {
    this.DC = global.DC;
  },
  mounted() {},
  methods: {
    changeIconHide() {
      let isif = this.iconHide;
      this.$store.commit("MSET_ICONHIDE", !isif);
    computed: {
        ...mapGetters(['iconHide', 'dimensionData', 'seeRight'])
    },
    leftNavClick(item) {
      // console.log(123132);
      //判断并关闭已开启标签
      let lnd = this.leftNavData;
      for (let k in lnd) {
        // console.log(this[this.leftNavData[k].layer]);
        if (lnd[k].label == item.label) {
          // console.log(lnd[k].label, "当前点击");
          continue;
    data () {
        return {
            icons: 'el-icon-d-arrow-right',
            navStyle: {
                right: '0px'
            },
            imgStyle: {
                right: '0'
            },
            leftNavData: [
                {
                    flag: true,
                    label: '标签',
                    // img: "/img/leftnav/tag.png",
                    img: '/img/leftnav/tag-checked.png',
                    normal: '/img/leftnav/tag.png',
                    checked: '/img/leftnav/tag-checked.png',
                    layer: 'tagLayer',
                    methods: getListarchitecture1,
                    imgSrc: 'https://map.hit.edu.cn/images/tarrow_xq.png'
                    // imgSrc: "img/mobile/pink.png",
                },
                {
                    flag: false,
                    label: '道路',
                    img: '/img/leftnav/way.png',
                    normal: '/img/leftnav/way.png',
                    checked: '/img/leftnav/way-checked.png',
                    layer: 'wayLayer',
                    methods: getListroad,
                    imgSrc: 'img/mobile/green.png'
                },
                {
                    flag: false,
                    label: '实景',
                    img: '/img/leftnav/scene.png',
                    normal: '/img/leftnav/scene.png',
                    checked: '/img/leftnav/scene-checked.png',
                    layer: 'sceneLayer',
                    methods: getListarchitecture,
                    imgSrc: 'img/leftnav/map-panorama.png'
                    // imgSrc: "img/mobile/blue.png",
                },
                {
                    flag: false,
                    label: '监控',
                    img: '/img/leftnav/monitor.png',
                    normal: '/img/leftnav/monitor.png',
                    checked: '/img/leftnav/monitor-checked.png',
                    layer: 'videoLayer',
                    methods: getListVideo,
                    imgSrc: '/img/leftnav/map-monitor.png'
                    // imgSrc: "img/mobile/blue.png",
                },
                // {
                //   flag: false,
                //   label: "活动",
                //   img: "/img/leftnav/activity.png",
                //   normal: "/img/leftnav/activity.png",
                //   checked: "/img/leftnav/activity-checked.png",
                //   layer: "activityLayer",
                //   methods: getListdoor,
                //   imgSrc: "img/mobile/brown.png",
                // },
                {
                    flag: false,
                    label: 'AED',
                    img: '/img/leftnav/aed.png',
                    normal: '/img/leftnav/aed.png',
                    checked: '/img/leftnav/aed-checked.png',
                    layer: 'aedLayer',
                    methods: getListcat,
                    type: 9,
                    imgSrc: 'img/leftnav/map-aed.png',
                    // imgSrc: "img/mobile/pink.png",
                    notShow: true
                },
                {
                    flag: false,
                    label: '停车',
                    img: '/img/leftnav/park.png',
                    normal: '/img/leftnav/park.png',
                    checked: '/img/leftnav/park-checked.png',
                    layer: 'parkLayer',
                    methods: getListcat,
                    type: 11,
                    imgSrc: 'https://map.hit.edu.cn/images/p-biao.png'
                    // imgSrc: "img/mobile/popcorn.png",
                },
                {
                    flag: false,
                    label: '出入',
                    img: '/img/leftnav/come.png',
                    normal: '/img/leftnav/come.png',
                    checked: '/img/leftnav/come-checked.png',
                    layer: 'comeLayer',
                    methods: getListcat,
                    type: 12,
                    imgSrc: 'img/leftnav/map-activity.png'
                    // imgSrc: "img/mobile/purple.png",
                }
            ],
            viewer: null,
            tagLayer: null,
            wayLayer: null,
            sceneLayer: null,
            videoLayer: null,
            activityLayer: null,
            aedLayer: null,
            parkLayer: null,
            comeLayer: null
        }
        if (this[this.leftNavData[k].layer]._show) {
          // console.log(lnd[k].label, "所有开启");
          this.leftNavData[k].flag = false;
          this.leftNavData[k].img = this.leftNavData[k].normal;
          this[this.leftNavData[k].layer].show = false;
        }
      }

      item.flag = !item.flag;
      if (item.flag == true) {
        item.img = item.checked;
        this[item.layer].show = true;
        // console.log("飞入");
        // this.flyTo(item);
        this.$store.dispatch("closeMobileWindowsDom"); //关闭弹窗
      } else {
        item.img = item.normal;
        this[item.layer].show = false;
      }
    },
    flyTo(item) {
      let that = this;
      let posi = this[item.layer].positions[0];
      // console.log(posi);
      let lntLat =
        that.dimensionData.pitch == -45
          ? [posi.lng + 0.00917, posi.lat - 0.0188, 500]
          : [posi.lng + 0.01197, posi.lat - 0.00055, 500];
      // that.mviewer.camera.flyTo({
      //   destination: Cesium.Cartesian3.fromDegrees(
      //     lntLat[0],
      //     lntLat[1],
      //     lntLat[2]
      //   ),
      // });
      // return;
      this.$store.dispatch("mapFlyTo", {
        //飞入
        lntLat: lntLat,
        // lntLat: [posi.lng + 0.01187, posi.lat - 0.0308, 4000],
        // lntLat: [121.50492752204283, 31.21567802276832, 2530],
        heading: that.dimensionData.heading,
        pitch: that.dimensionData.pitch,
        roll: that.dimensionData.roll,
        noOpen: true,
      });
    created () {
    },
    initialize(viewer) {
      var that = this;
      viewer.scene.globe.depthTestAgainstTerrain = false;
      this.viewer = viewer;
      this.tagLayer = new this.DC.HtmlLayer("tagLayer");
      viewer.addLayer(this.tagLayer);
    mounted () { },
    methods: {
        changeIconHide () {
            const isif = this.iconHide
            this.$store.commit('MSET_ICONHIDE', !isif)
        },
        leftNavClick (item) {
            // console.log(123132);
            // 判断并关闭已开启标签
            const lnd = this.leftNavData
            for (const k in lnd) {
                // console.log(this[this.leftNavData[k].layer]);
                if (lnd[k].label == item.label) {
                    // console.log(lnd[k].label, "当前点击");
                    continue
                }
                if (this[this.leftNavData[k].layer]._show) {
                    // console.log(lnd[k].label, "所有开启");
                    this.leftNavData[k].flag = false
                    this.leftNavData[k].img = this.leftNavData[k].normal
                    this[this.leftNavData[k].layer].show = false
                }
            }

      this.wayLayer = new this.DC.HtmlLayer("wayLayer");
      viewer.addLayer(this.wayLayer);
            item.flag = !item.flag
            if (item.flag == true) {
                item.img = item.checked
                this[item.layer].show = true
                // console.log("飞入");
                // this.flyTo(item);
                this.$store.dispatch('closeMobileWindowsDom') // 关闭弹窗
            } else {
                item.img = item.normal
                this[item.layer].show = false
            }
        },
        flyTo (item) {
            const that = this
            const posi = this[item.layer].positions[0]
            // console.log(posi);
            const lntLat =
                that.dimensionData.pitch == -45
                    ? [posi.lng + 0.00917, posi.lat - 0.0188, 500]
                    : [posi.lng + 0.01197, posi.lat - 0.00055, 500]
            // that.mviewer.camera.flyTo({
            //   destination: Cesium.Cartesian3.fromDegrees(
            //     lntLat[0],
            //     lntLat[1],
            //     lntLat[2]
            //   ),
            // });
            // return;
            this.$store.dispatch('mapFlyTo', {
                // 飞入
                lntLat: lntLat,
                // lntLat: [posi.lng + 0.01187, posi.lat - 0.0308, 4000],
                // lntLat: [121.50492752204283, 31.21567802276832, 2530],
                heading: that.dimensionData.heading,
                pitch: that.dimensionData.pitch,
                roll: that.dimensionData.roll,
                noOpen: true
            })
        },
        initialize (viewer) {
            var that = this
            viewer.scene.globe.depthTestAgainstTerrain = false
            this.viewer = viewer
            this.tagLayer = new global.DC.HtmlLayer('tagLayer')
            viewer.addLayer(this.tagLayer)

      // this.sceneLayer = new this.DC.VectorLayer("sceneLayer");
      this.sceneLayer = new this.DC.HtmlLayer("sceneLayer");
      viewer.addLayer(this.sceneLayer);
            this.wayLayer = new global.DC.HtmlLayer('wayLayer')
            viewer.addLayer(this.wayLayer)

      this.videoLayer = new this.DC.HtmlLayer("videoLayer");
      viewer.addLayer(this.videoLayer);
            // this.sceneLayer = new global.DC.VectorLayer("sceneLayer");
            this.sceneLayer = new global.DC.HtmlLayer('sceneLayer')
            viewer.addLayer(this.sceneLayer)

      // this.activityLayer = new this.DC.VectorLayer("activityLayer");
      this.activityLayer = new this.DC.HtmlLayer("activityLayer");
      viewer.addLayer(this.activityLayer);
            this.videoLayer = new global.DC.HtmlLayer('videoLayer')
            viewer.addLayer(this.videoLayer)

      // this.aedLayer = new this.DC.VectorLayer("aedLayer");
      this.aedLayer = new this.DC.HtmlLayer("aedLayer");
      viewer.addLayer(this.aedLayer);
            // this.activityLayer = new global.DC.VectorLayer("activityLayer");
            this.activityLayer = new global.DC.HtmlLayer('activityLayer')
            viewer.addLayer(this.activityLayer)

      this.parkLayer = new this.DC.HtmlLayer("parkLayer");
      viewer.addLayer(this.parkLayer);
            // this.aedLayer = new global.DC.VectorLayer("aedLayer");
            this.aedLayer = new global.DC.HtmlLayer('aedLayer')
            viewer.addLayer(this.aedLayer)

      // this.comeLayer = new this.DC.VectorLayer("comeLayer");
      this.comeLayer = new this.DC.HtmlLayer("comeLayer");
      viewer.addLayer(this.comeLayer);
            this.parkLayer = new global.DC.HtmlLayer('parkLayer')
            viewer.addLayer(this.parkLayer)

      let ourNum = that.leftNavData.length;
      for (let n = 0; n < ourNum; n++) {
        let ourD = this.leftNavData[n];
        let d = ourD.type ? { lifetype: ourD.type } : {};
        ourD.methods(d).then((res) => {
          let dom;
          let data = res.data.data;
          let position = that.changePoiton(data);
          let num = data.length;
          for (let k = 0; k < num; k++) {
            if (ourD.label == "标签") {
              dom = `
            // this.comeLayer = new global.DC.VectorLayer("comeLayer");
            this.comeLayer = new global.DC.HtmlLayer('comeLayer')
            viewer.addLayer(this.comeLayer)

            const ourNum = that.leftNavData.length
            for (let n = 0; n < ourNum; n++) {
                const ourD = this.leftNavData[n]
                const d = ourD.type ? { lifetype: ourD.type } : {}
                ourD.methods(d).then((res) => {
                    let dom
                    const data = res.data.data
                    const position = that.changePoiton(data)
                    const num = data.length
                    for (let k = 0; k < num; k++) {
                        if (ourD.label == '标签') {
                            dom = `
                        <div class="tag-entitys-box">
                            <div class="tag-content">
                               ${data[k].mechanismname}
@@ -297,12 +295,12 @@
                                <img src="${ourD.imgSrc}">
                            </div>
                        </div>
                    `;
            } else if (ourD.label == "道路") {
              // <div  class="way-title" style="border: white 1px solid; padding-left: 2px;font-size: 12px; background: #0066ff;  width: 12px;line-height: 13px; padding:2px 1px 2px 1px; color:white;">
              //    ${data[k].mechanismname}
              // </div>
              dom = `
                    `
                        } else if (ourD.label == '道路') {
                            // <div  class="way-title" style="border: white 1px solid; padding-left: 2px;font-size: 12px; background: #0066ff;  width: 12px;line-height: 13px; padding:2px 1px 2px 1px; color:white;">
                            //    ${data[k].mechanismname}
                            // </div>
                            dom = `
                        <div  class="way-entitys-box">
                            <div  class="way-title" style="border: white 1px solid; padding-left: 2px;font-size: 12px; background: #0066ff;  width: 12px;line-height: 13px; padding:2px 1px 2px 1px; color:white;">
                                 ${data[k].roadname}
@@ -311,19 +309,19 @@
                                <img src="https://map.hit.edu.cn/images/roadsign3.png">
                            </div>
                        </div>
                    `;
            } else if (ourD.label == "实景") {
              // <div  class="way-title" style="border: white 1px solid; padding-left: 2px;font-size: 12px; background: #0066ff;  width: 12px;line-height: 13px; padding:2px 1px 2px 1px; color:white;">
              //    ${data[k].mechanismname}
              // </div>
              dom = `
                    `
                        } else if (ourD.label == '实景') {
                            // <div  class="way-title" style="border: white 1px solid; padding-left: 2px;font-size: 12px; background: #0066ff;  width: 12px;line-height: 13px; padding:2px 1px 2px 1px; color:white;">
                            //    ${data[k].mechanismname}
                            // </div>
                            dom = `
                        <div class="scene-entitys-box">
                            <div>${data[k].mechanismname}</div>
                            <img src="/img/leftnav/map-panorama.png" alt="">
                        </div>
                        `;
            } else if (ourD.label == "AED") {
              dom = `
                        `
                        } else if (ourD.label == 'AED') {
                            dom = `
                        <div class="mobiletag-entitys-box">
                            <div class="tag-content">
                               ${data[k].mechanismname}
@@ -332,9 +330,9 @@
                                <img src="${ourD.imgSrc}">
                            </div>
                        </div>
                    `;
            } else if (ourD.label == "停车") {
              dom = `
                    `
                        } else if (ourD.label == '停车') {
                            dom = `
                        <div class="park-entitys-box">
                            <div class="park-title" alt="${data[k].mechanismname}">
                            </div>
@@ -347,9 +345,9 @@
                                </div>
                            </div>
                        </div>
                    `;
            } else if (ourD.label == "出入") {
              dom = `
                    `
                        } else if (ourD.label == '出入') {
                            dom = `
                        <div class="mobiletag-entitys-box-pink">
                            <div class="tag-content">
                               ${data[k].mechanismname}
@@ -358,141 +356,141 @@
                                <img src="${ourD.imgSrc}">
                            </div>
                        </div>
                    `;
            } else if (ourD.label == "监控") {
              dom = `
                    `
                        } else if (ourD.label == '监控') {
                            dom = `
                        <div class="monitor-entitys-box">
                            <div>${data[k].mechanismname}</div>
                            <img class="monitor-entitys-box" src="/img/leftnav/map-monitor.png" alt="">
                        </div>
                        `;
                        `
                        }
                        const divIcon = new global.DC.DivIcon(position[k], dom)
                        // 订阅事件
                        divIcon.on(global.DC.MouseEventType.CLICK, (e) => {
                            // console.log(data[k]);
                            const d = {
                                name:
                                    data[k].mechanismname ||
                                    data[k].roadname ||
                                    (ourD.label == '监控' ? '监控' : '无显示名字'),
                                bgImg: data[k].tpurl,
                                video: data[k].videourl || '',
                                from: 'labels',
                                introduce: data[k].introduce,
                                panoramaurl: data[k].panoramaurl
                            }
                            // 定制化窗体
                            that.openPopupS(
                                e.position,
                                [e.overlay._position._lng, e.overlay._position._lat],
                                d
                            )
                        })
                        that[that.leftNavData[n].layer].addOverlay(divIcon) // 加入图标
                    }
                    that[that.leftNavData[n].layer].positions = position
                    if (that.leftNavData[n].layer == 'tagLayer') {
                        // that.leftNavData[n].img = that.leftNavData[n].checked;
                    } else {
                        that[that.leftNavData[n].layer].show = false
                    }
                })
            }
            const divIcon = new that.DC.DivIcon(position[k], dom);
            //订阅事件
            divIcon.on(DC.MouseEventType.CLICK, (e) => {
              // console.log(data[k]);
              let d = {
                name:
                  data[k].mechanismname ||
                  data[k].roadname ||
                  (ourD.label == "监控" ? "监控" : "无显示名字"),
                bgImg: data[k].tpurl,
                video: data[k].videourl || "",
                from: "labels",
                introduce: data[k].introduce,
                panoramaurl: data[k].panoramaurl,
              };
              // 定制化窗体
              that.openPopupS(
                e.position,
                [e.overlay._position._lng, e.overlay._position._lat],
                d
              );
            });
            that[that.leftNavData[n].layer].addOverlay(divIcon); //加入图标
          }
          that[that.leftNavData[n].layer]["positions"] = position;
          if (that.leftNavData[n].layer == "tagLayer") {
            // that.leftNavData[n].img = that.leftNavData[n].checked;
          } else {
            that[that.leftNavData[n].layer].show = false;
          }
        });
      }
      // setTimeout(() => {
      //   this.tagLayer.show = false;
      // }, 500);
    },
    changePoiton(data) {
      // console.log(data);
      const list = [];
      let num = data.length;
      for (let i = 0; i < num; i++) {
        list.push(new this.DC.Position(data[i].jd, data[i].wd, 0));
      }
      return list;
    },
    mobileOpenImgs1() {
      let imgsDom = document.getElementById("mobileBigImgs");
      imgsDom.click();
    },
    goOn1() {},
    openPopupS(position, lntLat, query) {
      let that = this;
      // 定制化窗体
      let d = {
        position,
        lntLat,
        query: { ...(query || {}), position, lntLat },
        useJWD: true, //仅使用经纬度
      };
      that.$store.dispatch("setMobileWindows", d);
    },
  },
};
            // setTimeout(() => {
            //   this.tagLayer.show = false;
            // }, 500);
        },
        changePoiton (data) {
            // console.log(data);
            const list = []
            const num = data.length
            for (let i = 0; i < num; i++) {
                list.push(new global.DC.Position(data[i].jd, data[i].wd, 0))
            }
            return list
        },
        mobileOpenImgs1 () {
            const imgsDom = document.getElementById('mobileBigImgs')
            imgsDom.click()
        },
        goOn1 () { },
        openPopupS (position, lntLat, query) {
            const that = this
            // 定制化窗体
            const d = {
                position,
                lntLat,
                query: { ...(query || {}), position, lntLat },
                useJWD: true // 仅使用经纬度
            }
            that.$store.dispatch('setMobileWindows', d)
        }
    }
}
</script>

<style scoped lang="scss">
.m-left-nav {
  position: fixed;
  bottom: 30px;
  right: 0px;
  z-index: 200;
  background-color: #fff;
  border-radius: 17px 0 0 17px;
  transition: all 0.5s;
  .m-left-coutrol {
    position: absolute;
    left: -24px;
    top: 79px;
    width: 25px;
    height: 60px;
    position: fixed;
    bottom: 30px;
    right: 0px;
    z-index: 200;
    background-color: #fff;
    border-radius: 17px 0 0 17px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  ul {
    position: relative;
    top: 3px;
  }
  li {
    margin-bottom: 6px;
    font-weight: 400;
    display: block;
    width: 80px;
    height: 30px;
    line-height: 30px;
    background-color: #fff;
    border-radius: 15px;
    text-align: center;
    font-size: 0;
    cursor: pointer;

    img {
      position: relative;
      transition: all 0.5s;
      width: 24px;
      height: 24px;
      vertical-align: middle;
      margin-right: 10px;
      image-rendering: -moz-crisp-edges;
      image-rendering: -o-crisp-edges;
      image-rendering: -webkit-optimize-contrast;
      image-rendering: crisp-edges;
      -ms-interpolation-mode: nearest-neighbor;
    transition: all 0.5s;
    .m-left-coutrol {
        position: absolute;
        left: -24px;
        top: 79px;
        width: 25px;
        height: 60px;
        background-color: #fff;
        border-radius: 17px 0 0 17px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    span {
      display: inline-block;
      vertical-align: middle;
      font-size: 14px;
      color: #2f2f2f;
    ul {
        position: relative;
        top: 3px;
    }
  }
    li {
        margin-bottom: 6px;
        font-weight: 400;
        display: block;
        width: 80px;
        height: 30px;
        line-height: 30px;
        background-color: #fff;
        border-radius: 15px;
        text-align: center;
        font-size: 0;
        cursor: pointer;

        img {
            position: relative;
            transition: all 0.5s;
            width: 24px;
            height: 24px;
            vertical-align: middle;
            margin-right: 10px;
            image-rendering: -moz-crisp-edges;
            image-rendering: -o-crisp-edges;
            image-rendering: -webkit-optimize-contrast;
            image-rendering: crisp-edges;
            -ms-interpolation-mode: nearest-neighbor;
        }

        span {
            display: inline-block;
            vertical-align: middle;
            font-size: 14px;
            color: #2f2f2f;
        }
    }
}
.nones {
  display: none;
    display: none;
}
</style>

 src/components/mobilePopupOurOnce/index.vue

@@ -1,34 +1,32 @@
<template>
  <div class="mobilePopupOurOnce">
    <div
      class="mobilePopupOurOnce_center"
      :style="{
    <div class="mobilePopupOurOnce">
        <div
            class="mobilePopupOurOnce_center"
            :style="{
        borderBottom: !ends ? '#d4d4d4 dashed 1px' : '',
        marginBottom: !ends ? '6px' : '',
      }"
    >
      <div class="mobilePopupOurOnce_left">
        <!-- <img :src="icon" alt="" :key="icon" /> -->
        <el-image
          style="width: 80px; height: 80px"
          :src="icon"
          :id="'mobileBigImgs' + icon + ''"
          :preview-src-list="srcList"
        >
          <!-- v-show="false" -->
        </el-image>
      </div>
      <div class="mobilePopupOurOnce_right" @click.self.stop="openOnce('定位')">
        <div
          class="mobilePopupOurOnce_r_up"
          @click.self.stop="openOnce('定位')"
        >
          {{ onceData.name }}
        </div>
        <div class="mobilePopupOurOnce_r_down">
          <div v-for="(item, index) in seebut" :key="index">
            <el-link
              :icon="
            <div class="mobilePopupOurOnce_left">
                <!-- <img :src="icon" alt="" :key="icon" /> -->
                <el-image
                    style="width: 80px; height: 80px"
                    :src="icon"
                    :id="'mobileBigImgs' + icon + ''"
                    :preview-src-list="srcList"
                >
                    <!-- v-show="false" -->
                </el-image>
            </div>
            <div class="mobilePopupOurOnce_right" @click.self.stop="openOnce('定位')">
                <div
                    class="mobilePopupOurOnce_r_up"
                    @click.self.stop="openOnce('定位')"
                >{{ onceData.name }}</div>
                <div class="mobilePopupOurOnce_r_down">
                    <div v-for="(item, index) in seebut" :key="index">
                        <el-link
                            :icon="
                item.name == '实景'
                  ? 'el-icon-place'
                  : item.name == '图集'
@@ -37,191 +35,188 @@
                  ? 'el-icon-map-location'
                  : ''
              "
              class="mobilePopupOurOnce_r_d_in"
              @click="openOnce(item.name)"
              >{{ item.name }}</el-link
            >
            <el-divider
              direction="vertical"
              class="mobilePopupOurOnce_r_d_in"
              v-if="index != seebut.length - 1"
            ></el-divider>
          </div>
                            class="mobilePopupOurOnce_r_d_in"
                            @click="openOnce(item.name)"
                        >{{ item.name }}</el-link>
                        <el-divider
                            direction="vertical"
                            class="mobilePopupOurOnce_r_d_in"
                            v-if="index != seebut.length - 1"
                        ></el-divider>
                    </div>
                </div>
            </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import { mapGetters } from "vuex";
import { getChildNavDetail } from "@/api/mobile/public/arc";
import { mapGetters } from 'vuex'
import { getChildNavDetail } from '@/api/mobile/public/arc'
export default {
  props: ["onceData", "ends"],
  name: "mobilePopupOurOnce",
  created() {
    this.DC = global.DC;
    if (this.onceData.icon) {
      this.srcList = this.onceData.icon;
      this.icon = this.srcList[0];
    }
    if (this.onceData.from == "校区建筑" || this.onceData.from == "文化风景") {
      this.getOnceCampus(this.onceData.id);
    } else {
      this.ourData = this.onceData;
    }
  },
  data() {
    return {
      DC: "",
      icon: "",
      srcList: [],
      ourData: {},
    };
  },
  computed: {
    ...mapGetters(["mviewer"]),
    seebut() {
      let buts = this.onceData.buts;
      let b = [];
      for (let k in buts) {
        if (buts[k] == "实景") {
          continue;
    props: ['onceData', 'ends'],
    name: 'mobilePopupOurOnce',
    created () {
        if (this.onceData.icon) {
            this.srcList = this.onceData.icon
            this.icon = this.srcList[0]
        }
        b.push({
          name: buts[k],
        });
      }
      if (this.ourData.panoramaurl) {
        b.push({
          name: "实景",
        });
      } else {
        b = b.filter((res) => {
          return res.name != "实景";
        });
      }
      return b;
    },
  },
  methods: {
    openOnce(val) {
      if (!this.ourData.name) {
        console.log("数据传输失败");
        return;
      }
      let that = this;
      if (val == "定位") {
        //活动定位
        if (this.ourData.name == "活动") {
          console.log(this.ourData);
          return;
        if (this.onceData.from == '校区建筑' || this.onceData.from == '文化风景') {
            this.getOnceCampus(this.onceData.id)
        } else {
            this.ourData = this.onceData
        }
        //随地图移动窗口
        this.$store.commit("MSET_BIGPOPUP", false); //关闭全屏弹窗
        setTimeout(() => {
          //   // 定制化窗体
          let d = {
            position: {},
            lntLat: that.ourData.lntLat,
            query: { ...this.ourData, seebut: this.seebut },
            useJWD: true, //仅使用经纬度
            from: "PopupOurOnce",
          };
          that.popupsDom = that.$store.dispatch("setMobileWindows", d);
        }, 500);
        //固定窗口
        // that.$store.dispatch("SET_OPENWIDOWFIXED", d);
      } else if (val == "实景") {
        this.$store.commit("MSET_OPENMOBILEPANORAMA", this.ourData.panoramaurl);
        // if(this.ourData.panoramaurl){
        // }
        // console.log(this.ourData.panoramaurl);
      } else if (val == "图集") {
        let imgsDom = document.getElementById("mobileBigImgs" + this.icon + "");
        imgsDom.click();
      }
    },
    //"校区建筑"↓
    getOnceCampus(id) {
      getChildNavDetail({ id: id }).then((res) => {
        var result = res.data.data[0].list;
        let d = {
          name: result.mechanismname,
          lntLat: [result.jd, result.wd],
          alt: result.gd,
          heading: result.heading,
          pitch: result.pitch,
          roll: result.roll,
          bgImg: result.tpurl,
          QRImg: result.codeurl,
          websiteUrl: result.websiteurl,
          telePhone: result.telephone,
          address: result.address,
          introduce: result.introduce,
          video: result.videourl,
          panoramaurl: result.panoramaurl, //全景
        };
        this.ourData = d;
      });
    data () {
        return {
            icon: '',
            srcList: [],
            ourData: {}
        }
    },
    //"校区建筑"↑
  },
};
    computed: {
        ...mapGetters(['mviewer']),
        seebut () {
            const buts = this.onceData.buts
            let b = []
            for (const k in buts) {
                if (buts[k] == '实景') {
                    continue
                }
                b.push({
                    name: buts[k]
                })
            }
            if (this.ourData.panoramaurl) {
                b.push({
                    name: '实景'
                })
            } else {
                b = b.filter((res) => {
                    return res.name != '实景'
                })
            }
            return b
        }
    },
    methods: {
        openOnce (val) {
            if (!this.ourData.name) {
                console.log('数据传输失败')
                return
            }
            const that = this
            if (val == '定位') {
                // 活动定位
                if (this.ourData.name == '活动') {
                    console.log(this.ourData)
                    return
                }
                // 随地图移动窗口
                this.$store.commit('MSET_BIGPOPUP', false) // 关闭全屏弹窗
                setTimeout(() => {
                    //   // 定制化窗体
                    const d = {
                        position: {},
                        lntLat: that.ourData.lntLat,
                        query: { ...this.ourData, seebut: this.seebut },
                        useJWD: true, // 仅使用经纬度
                        from: 'PopupOurOnce'
                    }
                    that.popupsDom = that.$store.dispatch('setMobileWindows', d)
                }, 500)
                // 固定窗口
                // that.$store.dispatch("SET_OPENWIDOWFIXED", d);
            } else if (val == '实景') {
                this.$store.commit('MSET_OPENMOBILEPANORAMA', this.ourData.panoramaurl)
                // if(this.ourData.panoramaurl){
                // }
                // console.log(this.ourData.panoramaurl);
            } else if (val == '图集') {
                const imgsDom = document.getElementById('mobileBigImgs' + this.icon + '')
                imgsDom.click()
            }
        },
        // "校区建筑"↓
        getOnceCampus (id) {
            getChildNavDetail({ id: id }).then((res) => {
                var result = res.data.data[0].list
                const d = {
                    name: result.mechanismname,
                    lntLat: [result.jd, result.wd],
                    alt: result.gd,
                    heading: result.heading,
                    pitch: result.pitch,
                    roll: result.roll,
                    bgImg: result.tpurl,
                    QRImg: result.codeurl,
                    websiteUrl: result.websiteurl,
                    telePhone: result.telephone,
                    address: result.address,
                    introduce: result.introduce,
                    video: result.videourl,
                    panoramaurl: result.panoramaurl // 全景
                }
                this.ourData = d
            })
        }
        // "校区建筑"↑
    }
}
</script>

<style lang="scss" scoped>
// 继承类
.flexCenter {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}
.mobilePopupOurOnce {
  padding: 8px 0 0 0;
  margin: 0 8px;
  // background-image: linear-gradient(#29baf1, #28bbf0);
  .mobilePopupOurOnce_center {
    // margin-bottom: 8px;
    height: 80px;
    // border-bottom: #d4d4d4 dashed 1px;
    padding-bottom: 8px;
    @extend .flexCenter;
    .mobilePopupOurOnce_left {
      width: 32%;
      height: 100%;
      @extend .flexCenter;
      img {
        width: 80px;
    padding: 8px 0 0 0;
    margin: 0 8px;
    // background-image: linear-gradient(#29baf1, #28bbf0);
    .mobilePopupOurOnce_center {
        // margin-bottom: 8px;
        height: 80px;
      }
    }
    .mobilePopupOurOnce_right {
      width: 68%;
      height: 100%;
      @extend .flexCenter;
      flex-direction: column;
      .mobilePopupOurOnce_r_up {
        height: 50%;
        width: 100%;
        font-size: 16px;
        text-indent: 1em;
        display: flex !important;
        align-items: center !important;
        // color: #fff;
      }
      .mobilePopupOurOnce_r_down {
        height: 50%;
        width: 100%;
        padding-left: 1em;
        display: flex !important;
        align-items: center !important;
        .mobilePopupOurOnce_r_d_in {
          // color: #fff;
          font-size: 17px;
        // border-bottom: #d4d4d4 dashed 1px;
        padding-bottom: 8px;
        @extend .flexCenter;
        .mobilePopupOurOnce_left {
            width: 32%;
            height: 100%;
            @extend .flexCenter;
            img {
                width: 80px;
                height: 80px;
            }
        }
      }
        .mobilePopupOurOnce_right {
            width: 68%;
            height: 100%;
            @extend .flexCenter;
            flex-direction: column;
            .mobilePopupOurOnce_r_up {
                height: 50%;
                width: 100%;
                font-size: 16px;
                text-indent: 1em;
                display: flex !important;
                align-items: center !important;
                // color: #fff;
            }
            .mobilePopupOurOnce_r_down {
                height: 50%;
                width: 100%;
                padding-left: 1em;
                display: flex !important;
                align-items: center !important;
                .mobilePopupOurOnce_r_d_in {
                    // color: #fff;
                    font-size: 17px;
                }
            }
        }
    }
  }
}
</style>

 src/components/mobilemap/index.vue

@@ -45,7 +45,6 @@
            butbut: null,
            heights: 0,
            heights1: 0,
            DC: '',
            bigPopup: {
                width: 0,
                height: 0
@@ -134,9 +133,6 @@
    },
    mounted () {
        // return;
        var DC = global.DC
        this.DC = DC

        var that = this

        let viewer
@@ -200,7 +196,7 @@
        }

        function initViewer () {
            viewer = new DC.Viewer('mobile-viewer-container', {
            viewer = new global.DC.Viewer('mobile-viewer-container', {
                contextOptions: {
                    webgl: {
                        stencil: true,
@@ -219,8 +215,8 @@
            // const baselayer = DC.ImageryLayerFactory.createArcGisImageryLayer({
            //   url: "http://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer",
            // });
            const baselayer = that.DC.ImageryLayerFactory.createImageryLayer(
                that.DC.ImageryType.XYZ,
            const baselayer = global.DC.ImageryLayerFactory.createImageryLayer(
                global.DC.ImageryType.XYZ,
                {
                    // url: 'https://webmap-tile.sf-express.com/MapTileService/rt?x={col}&y={row}&z={level}'

@@ -259,7 +255,7 @@
            // });

            // 地图移动事件
            viewer.on(DC.MouseEventType.MOUSE_MOVE, (e) => {
            viewer.on(global.DC.MouseEventType.MOUSE_MOVE, (e) => {
                if (!that.iconHide) {
                    that.$store.commit('MSET_ICONHIDE', true)
                }
@@ -270,24 +266,24 @@
                // console.log(height);
            })

            // viewer.on(that.DC.SceneEventType.CAMERA_MOVE_END, (e) => {
            viewer.on(that.DC.SceneEventType.CAMERA_CHANGED, (e) => {
            // viewer.on(global.DC.SceneEventType.CAMERA_MOVE_END, (e) => {
            viewer.on(global.DC.SceneEventType.CAMERA_CHANGED, (e) => {
                // 相机移动最后参数
                // 控制高度
                const isSet = that.dimension != '3D'
                const height = Math.ceil(viewer.camera.positionCartographic.height)
                const conBack = (height) => {
                    viewer.camera.setView({
                        destination: that.DC.Namespace.Cesium.Cartesian3.fromRadians(
                        destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians(
                            viewer.camera.positionCartographic.longitude,
                            viewer.camera.positionCartographic.latitude,
                            height
                        ),
                        orientation: {
                            heading: that.DC.Namespace.Cesium.Math.toRadians(
                            heading: global.DC.Namespace.Cesium.Math.toRadians(
                                that.dimensionData.heading
                            ), // 方向
                            pitch: that.DC.Namespace.Cesium.Math.toRadians(
                            pitch: global.DC.Namespace.Cesium.Math.toRadians(
                                that.dimensionData.pitch
                            ), // 倾斜角度
                            roll: that.dimensionData.roll
@@ -326,16 +322,16 @@
            // 按钮事件
            const butSetViews = (num) => {
                viewer.camera.flyTo({
                    destination: that.DC.Namespace.Cesium.Cartesian3.fromRadians(
                    destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians(
                        viewer.camera.positionCartographic.longitude,
                        viewer.camera.positionCartographic.latitude,
                        num
                    ),
                    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
                    },
                    duration: 0.5 // 定位的时间间隔
@@ -430,16 +426,16 @@
                }
                var setViews = (num) => {
                    viewer.camera.flyTo({
                        destination: that.DC.Namespace.Cesium.Cartesian3.fromRadians(
                        destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians(
                            viewer.camera.positionCartographic.longitude,
                            viewer.camera.positionCartographic.latitude,
                            num
                        ),
                        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
                        },
                        duration: 0.5 // 定位的时间间隔
@@ -447,7 +443,7 @@
                    overii()
                }
                var isCameraTime = null
                viewer.on(that.DC.SceneEventType.CAMERA_CHANGED, (e) => {
                viewer.on(global.DC.SceneEventType.CAMERA_CHANGED, (e) => {
                    if (that.dimension == '2.5D') {
                        // console.log(e);
                        const height = Math.ceil(viewer.camera.positionCartographic.height)
@@ -589,9 +585,9 @@
            // 白模型↑

            // 精细模型↓
            const tilesetLayer = new that.DC.TilesetLayer('tilesetLayer')
            const tilesetLayer = new global.DC.TilesetLayer('tilesetLayer')
            viewer.addLayer(tilesetLayer)
            const tileset = new that.DC.Tileset('/mx/tileset.json', {
            const tileset = new global.DC.Tileset('/mx/tileset.json', {
                luminanceAtZenith: 0.5
            })

@@ -599,8 +595,8 @@
            // tilesetLayer.show = false;

            const silhouetteBlue =
                that.DC.Namespace.Cesium.PostProcessStageLibrary.createEdgeDetectionStage()
            silhouetteBlue.uniforms.color = that.DC.Namespace.Cesium.Color.fromBytes(
                global.DC.Namespace.Cesium.PostProcessStageLibrary.createEdgeDetectionStage()
            silhouetteBlue.uniforms.color = global.DC.Namespace.Cesium.Color.fromBytes(
                9,
                162,
                40
@@ -609,27 +605,27 @@
            silhouetteBlue.selected = []

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

            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()
            }
            // 点击事件
            tileset.on(DC.MouseEventType.CLICK, (e) => {
            tileset.on(global.DC.MouseEventType.CLICK, (e) => {
                viewer.scene.globe.depthTestAgainstTerrain = false
                // console.log(e);

                viewer.flyToPosition(
                    new that.DC.Position(115.87186406, 28.74449337, 1800, 0, 45, 0)
                    new global.DC.Position(115.87186406, 28.74449337, 1800, 0, 45, 0)
                )

                // 定制化窗体
@@ -646,7 +642,7 @@
                // 高亮
                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
                }
@@ -656,11 +652,11 @@

                    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(
                    e.feature.color = global.DC.Namespace.Cesium.Color.fromBytes(
                        155,
                        255,
                        175
@@ -668,10 +664,10 @@
                }
            })
            // 移动事件
            // tileset.on(that.DC.MouseEventType.MOUSE_MOVE, (e) => {
            // tileset.on(global.DC.MouseEventType.MOUSE_MOVE, (e) => {
            //   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;
            //   }
@@ -681,11 +677,11 @@

            //     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(
            //     e.feature.color = global.DC.Namespace.Cesium.Color.fromBytes(
            //       155,
            //       255,
            //       175
@@ -701,13 +697,13 @@
            // 2.5D贴图↓
            const usetowpointfive = () => {
                var provider =
                    // new that.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
                    // 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",
@@ -732,10 +728,10 @@
                    //     "19",
                    //   ],
                    // });
                    // new that.DC.Namespace.Cesium.ArcGisMapServerImageryProvider({
                    // new global.DC.Namespace.Cesium.ArcGisMapServerImageryProvider({
                    //   url: "http://arcgis.jxpskj.com:6080/arcgis/rest/services/PingXiang25DMapDN/MapServer",
                    // });
                    new that.DC.Namespace.Cesium.UrlTemplateImageryProvider({
                    new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({
                        url: '/wp/{z}/{x}/{y}.png',
                        fileExtension: 'png'
                    })
@@ -744,10 +740,10 @@

            const newLayer = usetowpointfive()
            // 2.5d贴图事件
            const layerGroup = new that.DC.LayerGroup('modelBox')
            const layerGroup = new global.DC.LayerGroup('modelBox')
            viewer.addLayerGroup(layerGroup)

            const areaLayer = new that.DC.VectorLayer('areaLayer')
            const areaLayer = new global.DC.VectorLayer('areaLayer')
            layerGroup.addLayer(areaLayer)
            axios
                .get(
@@ -761,11 +757,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,
@@ -783,7 +779,7 @@
            //   overlay: undefined,
            //   color: undefined,
            // };
            viewer.on(that.DC.MouseEventType.CLICK, (e) => {
            viewer.on(global.DC.MouseEventType.CLICK, (e) => {
                // console.log(e);
                if (e.overlay != undefined && e.layer.id == 'areaLayer') {
                    if (that.areaLayerSelect.overlay != undefined) {
@@ -803,7 +799,7 @@
                        that.areaLayerSelect.color = e.overlay._style.material
                        that.areaLayerSelect.overlay.setStyle({
                            outline: true,
                            outlineColor: that.DC.Namespace.Cesium.Color.fromBytes(
                            outlineColor: global.DC.Namespace.Cesium.Color.fromBytes(
                                3,
                                255,
                                13,
@@ -811,7 +807,7 @@
                            ), // 边框颜色
                            outlineWidth: 10, // 边框大小，
                            height: 0.01,
                            material: that.DC.Namespace.Cesium.Color.fromBytes(
                            material: global.DC.Namespace.Cesium.Color.fromBytes(
                                108,
                                245,
                                113,
@@ -883,7 +879,7 @@
                        viewer.camera.setView({
                            // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
                            // fromDegrees()方法，将经纬度和高程转换为世界坐标
                            destination: that.DC.Namespace.Cesium.Cartesian3.fromDegrees(
                            destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
                                // 114.0351,
                                // 27.6314,
                                // 200.0
@@ -893,9 +889,9 @@
                            ),
                            orientation: {
                                // 指向
                                heading: that.DC.Namespace.Cesium.Math.toRadians(h[0]),
                                heading: global.DC.Namespace.Cesium.Math.toRadians(h[0]),
                                // 视角
                                pitch: that.DC.Namespace.Cesium.Math.toRadians(h[1]),
                                pitch: global.DC.Namespace.Cesium.Math.toRadians(h[1]),
                                roll: h[2]
                            }
                        })
@@ -933,24 +929,24 @@
            // console.log(currentViewRect, 78);

            // 瀑布流↓
            const wallLayer = new that.DC.VectorLayer('wallLayer')
            const wallLayer = new global.DC.VectorLayer('wallLayer')
            // viewer.addLayer(wallLayer);
            // var arr = that.wallArr;
            // arr.forEach((item) => {
            //   item = item.join(",");
            // });
            // arr = arr.join(";");
            // const wall = new that.DC.Wall(arr);
            // const wall = new global.DC.Wall(arr);
            // wall.setStyle({
            //   material: new that.DC.WallTrailMaterialProperty({
            //     color: that.DC.Namespace.Cesium.Color.fromBytes(0, 142, 255, 150),
            //     // color: that.DC.Color.DEEPSKYBLUE,
            //   material: new global.DC.WallTrailMaterialProperty({
            //     color: global.DC.Namespace.Cesium.Color.fromBytes(0, 142, 255, 150),
            //     // color: global.DC.Color.DEEPSKYBLUE,
            //     speed: 4,
            //   }),
            // });
            // wallLayer.addOverlay(wall);

            // viewer.use(new that.DC.Measure());
            // viewer.use(new global.DC.Measure());
            // 瀑布流↑

            // 传入store
@@ -1016,7 +1012,7 @@
            viewer.scene.screenSpaceCameraController._maximumZoomRate = 5906376272000
        }

        DC.ready(initViewer)
        global.DC.ready(initViewer)
        setTimeout(() => {
            that.butbut()


 src/divForms/divForms.js

@@ -6,18 +6,12 @@
 * @LastEditors: Morpheus
 * @LastEditTime: 2020-10-22 13:48:22
 */

import DC from '@dvgis/dc-sdk/dist/dc.base.min' // 基础包
import DcCore from '@dvgis/dc-sdk/dist/dc.core.min' // 核心包

DC.use(DcCore) // 安装DC核心库

class DivForms {
    /**
     * @popup 存放 dom 相关
     *
     */
    constructor (viewer, popup) {
    constructor(viewer, popup) {
        this._viewer = viewer
        this._popup = popup
        this._position = popup.position
@@ -54,7 +48,7 @@
    movePopup (id) {
        var self = this
        return function () {
            const windowCoord = DC.Namespace.Cesium.SceneTransforms.wgs84ToWindowCoordinates(
            const windowCoord = global.DC.Namespace.Cesium.SceneTransforms.wgs84ToWindowCoordinates(
                self._viewer.scene,
                self._position[0]
            )

 src/divForms/panoramaBox.js

@@ -6,18 +6,12 @@
 * @LastEditors: Morpheus
 * @LastEditTime: 2020-10-22 13:48:22
 */

import DC from '@dvgis/dc-sdk/dist/dc.base.min' // 基础包
import DcCore from '@dvgis/dc-sdk/dist/dc.core.min' // 核心包

DC.use(DcCore) // 安装DC核心库

class PanoramaBox {
    /**
     * @popup 存放 dom 相关
     *
     */
    constructor (viewer, popup) {
    constructor(viewer, popup) {
        this._viewer = viewer
        this._popup = popup
        this._position = popup.position
@@ -52,7 +46,7 @@
    movePopup (id) {
        var self = this
        return function () {
            const windowCoord = DC.Namespace.Cesium.SceneTransforms.wgs84ToWindowCoordinates(
            const windowCoord = global.DC.Namespace.Cesium.SceneTransforms.wgs84ToWindowCoordinates(
                self._viewer.scene,
                self._position[0]
            )

 src/store/modules/mobile.js

@@ -692,7 +692,7 @@
            )
            billboard.size = [16, 16]
            // 订阅事件3
            billboard.on(DC.MouseEventType.CLICK, (e) => {
            billboard.on(global.DC.MouseEventType.CLICK, (e) => {
                // 定制化窗体
                const query = {
                    name: '选择点'

 src/store/modules/mobiles/urlParameter.js

@@ -1,20 +1,20 @@
let urlParameter = {
const urlParameter = {
    state: {
        urlParameterData: {},
        urlParameterLayer: null, //自定义标签图层
        urlParameterLayer: null // 自定义标签图层
    },
    actions: {
        addurlParameterLayerIcon({
        addurlParameterLayerIcon ({
            state,
            commit,
            dispatch
        }, val) {
            let list = val.list;
            const list = val.list
            if (val.clear) {
                //     state.urlParameterLayer.remove();
                state.urlParameterLayer.clear();
                state.urlParameterLayer.clear()
            }
            for (let i in list) {
            for (const i in list) {
                // console.log(list[i], 112233)
                const divIcon = new global.DC.DivIcon(
                    new global.DC.Position(
@@ -32,43 +32,43 @@
                              </div>
                          </div>
                      `
                );
                )
                divIcon.on(global.DC.MouseEventType.CLICK, (e) => {
                    let lntLat = [+list[i].jd, +list[i].wd]
                    let d = {
                    const lntLat = [+list[i].jd, +list[i].wd]
                    const d = {
                        position: {},
                        lntLat: lntLat,
                        query: {
                            introduce: '自定义标签',
                            address: '',
                            ...(list[i] || {}),
                            lntLat: lntLat,
                            lntLat: lntLat
                        },
                        useJWD: true, //仅使用经纬度
                    };
                    dispatch("setMobileWindows", d);
                        useJWD: true // 仅使用经纬度
                    }
                    dispatch('setMobileWindows', d)
                })
                state.urlParameterLayer.addOverlay(divIcon);
                state.urlParameterLayer.addOverlay(divIcon)
            }
        },
        }
    },
    mutations: {
        initurlParameterLayer(state, val) {
        initurlParameterLayer (state, val) {
            if (!state.urlParameterLayer) {
                state.urlParameterLayer = new global.DC.HtmlLayer("urlParameterLayer");
                state.mviewer.addLayer(state.urlParameterLayer);
                state.urlParameterLayer = new global.DC.HtmlLayer('urlParameterLayer')
                state.mviewer.addLayer(state.urlParameterLayer)
            }
        },
        set_urlParameterData(state, val) {
            state.urlParameterData = val;
        set_urlParameterData (state, val) {
            state.urlParameterData = val
        },

        clearurlParameterLayerIcon(state, val) {
        clearurlParameterLayerIcon (state, val) {
            if (state.urlParameterLayer) {
                state.urlParameterLayer.clear();
                state.urlParameterLayer.clear()
            }
        },
        }
    }
}

export default urlParameter
export default urlParameter