定位更换 底部定位按钮开启 点击绿色搜索条件完善 extent，更新 主要楼宇开启 定位描点BUG修复

shuishen

2023-12-08 4624a543f7d79d37ec7ed154ff8ea5db17b82632

定位更换
底部定位按钮开启
点击绿色搜索条件完善
extent，更新
主要楼宇开启
定位描点BUG修复

 public/img/icon/location.png

 src/components/map/index.vue

@@ -65,8 +65,8 @@
    {
        key: 2,
        tileUrl: "https://fkxt.jxstnu.edu.cn/changjing/arcgis/rest/services/ksdflxq/MapServer/tile/{z}/{y}/{x}",
        center: [112.6202242373625, -0.0811745423945008147645],
        resolution: 0.00007614275218656896,
        center: [112.6102242373625, -0.0741745423945008147645],
        resolution: 0.00003807137609328448,
        origin: [-400.0, 399.9999999999998],
        resolutions: [
            0.00015228550437313792, 0.00007614275218656896, 0.00003807137609328448,
@@ -75,7 +75,7 @@
        fullExtent: [
            112.51302551881798, -0.16235359398493399, 112.72742295590702, 0.000004509195932360471
        ],
        polygonUrl: 'https://fkxt.jxstnu.edu.cn/changjing/lkarcgisapp'
        polygonUrl: 'http://59.55.128.156:6080/arcgis/rest/services/fllk/MapServer/0/query'
    }
]

@@ -356,7 +356,7 @@

            this.$store.commit('CLEAR_ALL', null)

            getDetail({ mechanismname: event.target.values_.attributes['楼栋号'] }).then((res) => {
            getDetail({ mechanismname: event.target.values_.attributes['楼栋号'], campus: this.layoutElement.campusValue }).then((res) => {
                if (JSON.stringify(res.data.data) == '{}') return
                let result = res.data.data


 src/components/mobileCortrolButtom/index.vue

@@ -26,9 +26,9 @@
        <div class="m-l-inbut" @click="zoomIns">
            <i class="el-icon-refresh"></i>
        </div>
        <!-- <div class="m-l-inbut" @click="goOns">
        <div class="m-l-inbut" @click="goOns">
            <i class="el-icon-location"></i>
        </div> -->
        </div>
        <div class="m-l-inbut" @click="openOurSee">
            <i class="el-icon-map-location"></i>
        </div>
@@ -42,9 +42,47 @@
import { getActivity } from '@/api/mobile/hd/hd'

import { GCJ02ToWGS84 } from '@/utils/CoordTransform'
import { textHeights } from 'ol/render/canvas'

let extent = [
    {
        key: 1,
        xMin: 112.51303616638316,
        yMin: -0.103420786429659,
        xMax: 112.67880038471827,
        yMax: 0.000004508906477476281,
        resolution: 0.00001903568804664224,

        x: (x, y) => {
            return -250.6503 + 2.0389 * x + 4.4338 * y
        },

        y: (x, y) => {
            return 228.1454 - 2.321 * x + 1.4165 * y
        },
    },

    {
        key: 2,
        xMin: 112.51302551881798,
        yMin: -0.16235359398493399,
        xMax: 112.72742295590702,
        yMax: 0.000004509195932360471,
        resolution: 0.00001903568804664224,

        x: (x, y) => {
            return -802.9905 + 6.1504 * x + 7.0694 * y
        },

        u: (x, y) => {
            return 295.4321 - 3.4878 * x + 3.775 * y
        },
    },
]

export default {
    name: 'mobileCortrolButtom',

    data () {
        return {
            tabTable: [],
@@ -110,48 +148,37 @@
            var options = { timeout: 8000 }// 设置定位超时

            window.geolocation.getLocation(showPosition, showErrow, options)
            this.$store.commit('GET_NOWPOSITION', (res) => {
                that.$store.dispatch('pcMoveView', {
                    jd: res[0],
                    wd: res[1],
                    viewer: global.viewer
                })

                const data = [
                    {
                        name: '我的位置',
                        jd: res[0],
                        wd: res[1]
                    }
                ]

                that.$store.dispatch('addLabelLayerIconMobelUse', {
                    list: data,
                    clear: true,
                    mviewer: global.viewer
                })
            })
            let cur = extent.find((item) => item.key == this.mobileMapElement.campusValue)

            function showPosition (result) {
                const position = GCJ02ToWGS84(result.lng, result.lat)
                let positionWgs = GCJ02ToWGS84(result.lng, result.lat)

                let position = {
                    lng: positionWgs[0],
                    lat: positionWgs[1],
                }

                const data = {
                    name: '我的位置',
                    jd: position[0],
                    wd: position[1]
                    jd: position.lng,
                    wd: position.lat
                }

                // 经管
                if (position[0] > 115.78815057 && position[0] < 115.80346610 && position[1] > 28.63771847 && position[1] < 28.64981682) {
                if (
                    position.lng > cur.xMin &&
                    position.lng < cur.xMax &&
                    position.lat > cur.yMin &&
                    position.lat < cur.yMax
                ) {
                    that.$store.dispatch('pcMoveView', {
                        jd: position[0],
                        wd: position[1],
                        viewer: global.viewer
                        jd: position.lng,
                        wd: position.lat,
                        resolution: cur.resolution,
                    })
                    that.$store.dispatch('addLabelLayerIconMobelUse', {
                        data: data,
                        clear: true,
                        mviewer: global.viewer
                        clear: true
                    })
                } else {
                    that.$message({
@@ -159,26 +186,6 @@
                        type: 'warning'
                    })
                }

                // 师大
                // if (position[0] > 116.009836 && position[0] < 116.045022 && position[1] > 28.664168 && position[1] < 28.699788) {
                //     that.$store.dispatch('pcMoveView', {
                //         jd: position[0],
                //         wd: position[1],
                //         viewer: global.viewer
                //     })

                //     that.$store.dispatch('addLabelLayerIconMobelUse', {
                //         list: data,
                //         clear: true,
                //         mviewer: global.viewer
                //     })
                // } else {
                //     that.$message({
                //         message: '您当前位置超出学校范围',
                //         type: 'warning'
                //     })
                // }
            }

            function showErrow (result) {

 src/components/mobilePopupOurAfter/index.vue

@@ -147,7 +147,7 @@
                { name: '校园宿舍', type: 4, method: getChildNavList },
                { name: '文化风景', type: 5, method: getChildNavList },
                // { name: '家属住宅', type: 6, method: getChildNavList },
                // { name: '其他楼宇', type: 7, method: getChildNavList }
                { name: '主要楼宇', type: 7, method: getChildNavList }
            ],
            // openData3: [
            //   { name: "食堂餐厅", type: 1, method: getListlivingFacilitiesr },

 src/components/mobileWindow/index.vue

@@ -74,6 +74,42 @@
import { mapGetters } from 'vuex'
import { GCJ02ToWGS84 } from '@/utils/CoordTransform'

let extent = [
    {
        key: 1,
        xMin: 112.51303616638316,
        yMin: -0.103420786429659,
        xMax: 112.67880038471827,
        yMax: 0.000004508906477476281,
        resolution: 0.00001903568804664224,

        x: (x, y) => {
            return -250.6503 + 2.0389 * x + 4.4338 * y
        },

        y: (x, y) => {
            return 228.1454 - 2.321 * x + 1.4165 * y
        },
    },

    {
        key: 2,
        xMin: 112.51302551881798,
        yMin: -0.16235359398493399,
        xMax: 112.72742295590702,
        yMax: 0.000004509195932360471,
        resolution: 0.00001903568804664224,

        x: (x, y) => {
            return -802.9905 + 6.1504 * x + 7.0694 * y
        },

        y: (x, y) => {
            return 295.4321 - 3.4878 * x + 3.775 * y
        },
    },
]

export default {
    name: 'mobileWindow',
    computed: {
@@ -123,10 +159,12 @@
        }
    },

    inject: ['mobileMapElement'],

    mounted () {
        this.$EventBus.$on('clearTimoutTime', () => {
            if (this.navigationFlag == true) {
                window.geolocation.clearWatch()
                // window.geolocation.clearWatch()

                this.$store.dispatch('removeLabelLayerIconMobelUse')
            }
@@ -242,13 +280,14 @@
                }
            }

            // 需要传入路网url
            that.$store.dispatch('MSET_GOTOWHERE', ints)
        },

        getCurrentLocation (flag = true) {
            const that = this

            window.geolocation.watchPosition(that.showPosition)
            // window.geolocation.watchPosition(that.showPosition)

            window.geolocation.getLocation(that.showPosition, that.showErrow, {
                timeout: 8000
@@ -258,35 +297,41 @@
        showPosition (result) {
            const that = this

            const position = GCJ02ToWGS84(result.lng, result.lat)
            let cur = extent.find((item) => item.key == this.mobileMapElement.campusValue)

            let positionWgs = GCJ02ToWGS84(result.lng, result.lat)

            let position = {
                lng: cur.x(positionWgs[0], positionWgs[1]),
                lat: cur.y(positionWgs[0], positionWgs[1]),
            }

            const data = {
                name: '我的位置',
                jd: position[0],
                wd: position[1]
                jd: position.lng,
                wd: position.lat
            }

            that.$store.dispatch('addLabelLayerIconMobelUse', {
                data: data,
                clear: true,
                mviewer: global.viewer
            })

            if (that.navigationFlag == true) return

            if (position[0] > 115.78815057 && position[0] < 115.80346610 && position[1] > 28.63771847 && position[1] < 28.64981682) {
            if (
                position.lng > cur.xMin &&
                position.lng < cur.xMax &&
                position.lat > cur.yMin &&
                position.lat < cur.yMax
            ) {
                that.$store.dispatch('pcMoveView', {
                    jd: position[0],
                    wd: position[1],
                    viewer: global.viewer
                    jd: position.lng,
                    wd: position.lat,
                    resolution: cur.resolution,
                })

                that.$store.dispatch('addLabelLayerIconMobelUse', {
                    data: data,
                    clear: true,
                    mviewer: global.viewer
                })
                that.doit([position[0], position[1]])

                that.doit([position.lng, position.lat])

                that.navigationFlag = true
            } else {

 src/components/mobilemap/index.vue

@@ -109,7 +109,7 @@
        fullExtent: [
            112.51302551881798, -0.16235359398493399, 112.72742295590702, 0.000004509195932360471
        ],
        polygonUrl: 'https://fkxt.jxstnu.edu.cn/changjing/lkarcgisapp'
        polygonUrl: 'http://59.55.128.156:6080/arcgis/rest/services/fllk/MapServer/0/query'
    }
]

@@ -329,7 +329,8 @@
            const that = this

            getBuildClock({
                mechanismname: event.target.values_.attributes['楼栋号']
                mechanismname: event.target.values_.attributes['楼栋号'],
                campus: this.campusValue
            }).then((res) => {
                if (JSON.stringify(res.data.data) == '{}') return
                const item = res.data.data

 src/pcLayout/index.vue

@@ -42,7 +42,7 @@
                            <el-menu-item index="/pcLayout/default/arc/dorm">校园宿舍</el-menu-item>
                            <el-menu-item index="/pcLayout/default/arc/culture">文化风景</el-menu-item>
                            <!-- <el-menu-item index="/pcLayout/default/arc/family">家属住宅</el-menu-item> -->
                            <!-- <el-menu-item index="/pcLayout/default/arc/rest">主要楼宇</el-menu-item> -->
                            <el-menu-item index="/pcLayout/default/arc/rest">主要楼宇</el-menu-item>
                        </el-submenu>
                        <!-- popper-class="only-life-box" -->
                        <el-submenu index="service">

 src/store/modules/mobilePosition.js

@@ -34,11 +34,11 @@
    yMax: 0.000004509195932360471,

    x: (x, y) => {
      return -789.1274 + 6.0609 * x + 6.9479 * y;
      return -802.9905 + 6.1504 * x + 7.0694 * y;
    },

    x: (x, y) => {
      return 298.9294 - 3.5295 * x + 3.8211 * y;
      return 295.4321 - 3.4878 * x + 3.775 * y;
    },
  },
];

 src/store/modules/openlayerData.js

@@ -49,7 +49,24 @@
    },
    openlayers: {
      map2D: new OlMap({
        layers: [],
        layers: [
          /**
             *  new OlLayerTile({
                zIndex: 4,
                title: "影像",
                source: new XYZ({
                  url: "http://t4.tianditu.com/DataServer?T=vec_w&tk=b9031f80391e6b65bd1dd80dcde1b097&x={x}&y={y}&l={z}", // 行政区划
                }),
              }),
              new OlLayerTile({
                zIndex: 5,
                title: "影像",
                source: new XYZ({
                  url: "http://t4.tianditu.com/DataServer?T=cva_w&tk=b9031f80391e6b65bd1dd80dcde1b097&x={x}&y={y}&l={z}", // 行政区划
                }),
              }),
             */
        ],
        view: new OlView({}),
      }),
      map3D: null,

 src/store/modules/popupParams.js

@@ -160,34 +160,7 @@
  },
  actions: {
    ...leftNavsData.actions,
    openPopups({ state, commit, dispatch }, value) {
      //     //订阅事件
      //   divIcon.on(global.DC.MouseEventType.CLICK, (e) => {
      //     that.openPopups({
      //       lng: e.overlay.position.lng,
      //       lat: e.overlay.position.lat,
      //       item: item,
      //     });
      //   });
      var box = new global.DC.DivForms(state.viewer, {
        domId: "divFormsDomBox",
        position: [
          global.DC.Transform.transformWGS84ToCartesian(
            new global.DC.Position(
              Number(value.lng),
              Number(value.lat),
              Number(value.alt || 0)
            )
          ),
        ],
      });
      dispatch("setOurDataInPoput", value);
      dispatch("pcFlyView", {
        jd: value.lng,
        wd: value.lat,
        viewer: this.viewer,
      });
    },

    setOurDataInPoput({ state, commit, dispatch }, value) {
      // 弹窗使用方法
      commit("CLEAR_ALL", null);
@@ -223,7 +196,7 @@
        .setCenter([val.jd, val.wd]);
      openlayerData.state.openlayers.map2D
        .getView()
        .setResolution(0.00009517844023321122);
        .setResolution(val.resolution);
    },

    pcFlyView({ state, commit, dispatch }, val) {
@@ -308,12 +281,16 @@
    },

    addLabelLayerIconMobelUse({ state, commit, dispatch }, val) {
      if (window.labelLayer) {
        window.labelLayer.getSource().clear();
      } else {
      window.labelLayer = new VectorLayer({
        // 图标图层
        zIndex: 32,
        source: new VectorSource(),
      });
      openlayerData.state.openlayers.map2D.addLayer(window.labelLayer);
      }

      // state.myviewer = val.mviewer
      if (val.clear) {
@@ -322,18 +299,8 @@
      }

      const iconFeature = new Feature({
        geometry: new Point([Number(post[0]), Number(post[1])]),
        attributes: {
          data: value[2],
          ourD: {
            label: value[2].from,
          },
          lntLat: [post[0], post[1]],
        },
        geometry: new Point([Number(val.data.jd), Number(val.data.wd)]),
      });

      var textElement = document.createElement("span");
      textElement.innerHTML = point[k].name;

      iconFeature.setStyle(
        new Style({