youhua

少年

2024-02-27 c6df06bd690486739067ee1ee7124ac66da720fb

youhua

 src/assets/img/statistics/camera.png

 src/components/leftMenu/bottom2.vue

@@ -168,7 +168,7 @@
  },
  methods: {
    flyBack() {
      map.getView().animate({
      window.mapapi.getView().animate({
        // 只设置需要的属性即可
        center: [116.52217697339846, 39.75979421847914], // 中心点
        zoom: 12, // 缩放级别

 src/components/login.vue

@@ -29,7 +29,7 @@
      var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
      var r = window.location.search.substr(1).match(reg);
      if (r != null) {
        this.$router.push("/index");
        this.$router.push("/home");
      }
      return null;
    },

 src/components/poplayer/history2.vue

@@ -131,7 +131,8 @@
  z-index: 2;
  width: 100vw;
  height: 100vh;
  background: rgba(0, 0, 0, 0.5);
  /* background: rgba(0, 0, 0, 0.5); */
  background: #ffffff;
  top: 0;
  left: 0;
}

 src/components/rightMenu/bottom2.vue

@@ -177,7 +177,7 @@
      const view = window.mapapi.getView();
      const zoom = view.getZoom();

      map.getView().animate({
      window.mapapi.getView().animate({
        // 只设置需要的属性即可
        center: window.mapapi.getView().getCenter(), // 中心点
        zoom: zoom + 1, // 缩放级别
@@ -189,7 +189,7 @@
      const view = window.mapapi.getView();
      const zoom = view.getZoom();

      map.getView().animate({
      window.mapapi.getView().animate({
        // 只设置需要的属性即可
        center: window.mapapi.getView().getCenter(), // 中心点
        zoom: zoom - 1, // 缩放级别

 src/components/sideMenu/layerMenu/layerPanel2.vue

@@ -178,19 +178,19 @@
  },
  mounted() {
    this.$nextTick(() => {
      setTimeout(() => {
        this.handleEMapClick(
          {
            id: "yxdt",
            name: "影像地图",
            active: true,
            type: "er",
            src: "/static/img/yxdt.cf4698e.png",
          },
          1
        );
        loadEnterprise();
      }, 2000);
      // setTimeout(() => {
      //   this.handleEMapClick(
      //     {
      //       id: "yxdt",
      //       name: "影像地图",
      //       active: true,
      //       type: "er",
      //       src: "/static/img/yxdt.cf4698e.png",
      //     },
      //     1
      //   );
      //   loadEnterprise();
      // }, 2000);
    });
  },
  methods: {
@@ -227,13 +227,14 @@
    // 二维底图选择
    handleEMapClick(result, index) {
      // 设置相机
      if (result.name == "二维地图") {
        window.mapapi.getLayerByName("二维地图").setVisible(true);
        window.mapapi.getLayerByName("影像地图").setVisible(false);
      } else if (result.name == "影像地图") {
        window.mapapi.getLayerByName("影像地图").setVisible(true);
        window.mapapi.getLayerByName("二维地图").setVisible(false);
      }
      // if (result.name == "二维地图") {
      //   window.mapapi.getLayerByName("二维地图").setVisible(true);
      //   window.mapapi.getLayerByName("影像地图").setVisible(false);
      // } else if (result.name == "影像地图") {
      //   window.mapapi.getLayerByName("影像地图").setVisible(true);
      //   window.mapapi.getLayerByName("二维地图").setVisible(false);
      // }

      // 切换图层
      const val = layers.filter((res) => {
        if (res.name == result.name) {
@@ -241,6 +242,73 @@
        }
      });
      const children = val[0].children;
      // console.log(children, '111')
      if (result.name == '影像地图') {
        //加载航拍影像
        window.ImageLayer = new ol.layer.Tile({
          id: 'C0698021',
          visible: true,
          source: new ol.source.XYZ({
            wrapX: true,
            url: `${'https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer'}/tile/{z}/{y}/{x}`,
          }),
          projection: new ol.proj.get('EPSG:4326')
        });
        window.mapapi.addLayer(window.ImageLayer);

        //加载高德标注
        window.annotation = new ol.layer.Tile({
          id: '69EB42A8',
          visible: true,
          source: new ol.source.XYZ({
            wrapX: true,
            url: `https://webst02.is.autonavi.com/appmaptile?style=8&x={x}&y={y}&z={z}`,
          }),
          projection: new ol.proj.get('EPSG:4326')
        });
        window.mapapi.addLayer(window.annotation);


        window.hexin = new ol.layer.Tile({
          source: new ol.source.TileWMS({
            ratio: 3,
            url: 'https://skyzt.bda.gov.cn/gisserver/wmsserver/YZ_BJ60',//图层地址
            params: {
              'VERSION': '1.1.1',
              'SRS': 'EPSG:4326',
              'FORMAT': 'image/png',
              'TILED': true,
              "LAYERS": ''
            }
          })
        })
        window.mapapi.addLayer(window.hexin)


        //亦庄新城规划范围
        window.yizhuang = new ol.layer.Tile({
          source: new ol.source.TileWMS({
            ratio: 3,
            url: 'https://skyzt.bda.gov.cn/gisserver/wmsserver/YZ_BJ',//图层地址
            params: {
              'VERSION': '1.1.1',
              'SRS': 'EPSG:4326',
              'FORMAT': 'image/png',
              'TILED': true,
              "LAYERS": ''
            }
          })
        })
        window.mapapi.addLayer(window.yizhuang)
      } else {
        window.mapapi.removeLayer(window.ImageLayer);
        window.mapapi.removeLayer(window.annotation)
        window.mapapi.removeLayer(window.hexin);
        window.mapapi.removeLayer(window.yizhuang);
      }



      if (this.curEMapModelIndex == index) {
        // 再次点击选中的item时取消选择
        // clearLayerByTypeId(result.id);
@@ -248,14 +316,14 @@
      } else {
        this.curSMapModelIndex = -1;
        this.curEMapModelIndex = index;
        clearLayerByTypeIdArr(["ewdt", "yxdt"]);
        clearLayerByTypeIdArr(["3Dcs", "swmx"]);
        _GLOBAL.layers[result.id] = [];
        children.forEach((item) => {
          let itemLayer = loadLayer(item);
          _GLOBAL.layers[result.id].push(itemLayer);
          // console.log(_GLOBAL.layers[result.id]);
        });
        // clearLayerByTypeIdArr(["ewdt", "yxdt"]);
        // clearLayerByTypeIdArr(["3Dcs", "swmx"]);
        // _GLOBAL.layers[result.id] = [];
        // children.forEach((item) => {
        //   let itemLayer = loadLayer(item);
        //   _GLOBAL.layers[result.id].push(itemLayer);
        //   // console.log(_GLOBAL.layers[result.id]);
        // });
      }
    },
    // 三维模型选择
@@ -357,7 +425,7 @@
    },
    // 第二行 专题图 点击
    handleZTlick(result, index) {
      console.log(result, index);
      // console.log(result, index);
      const val = layers.filter((res) => {
        if (res.name == result.name) {
          return res;
@@ -378,75 +446,81 @@
      if (this.curFuncIndex == index) {
        store.setTdglFlag(false);
        store.setPoplayerListAction({});
        divPoint3 && divPoint3.deleteObject();
        store.setPoplayerShowAction(false);
        this.curFuncIndex = -1;
        // window.clusterLayer && window.clusterLayer.clear();
        if (window.tdglLine) {
          window.mapapi.removeLayer(window.tdglLine);
          window.tdglLine = null;
        }
        this.curFuncIndex = -1;
        window.clusterLayer && window.clusterLayer.clear();
        if (window.tdglLayer) {
        if (window.tdgllayer) {
          store.setSliderShow(false);
          window.mapapi.removeLayer(window.tdglLayer);
          window.mapapi.removeLayer(window.tdgllayer);
          window.tdgllayer = null;
        }
      } else {
        this.curFuncIndex = index;
        // 隐藏底部图层面版
        store.setLayerPanelShow(false);
        // 隐藏右上角菜单面板
        store.setMenuListShow(false);
        // 隐藏底部漫游面板
        store.setRoamPanelShow(false);
        this.curFuncIndex = index;
        switch (index) {
          case 0:
            if (window.tdgllayer) {
              window.mapapi.removeLayer(window.tdgllayer);
              store.setSliderShow(false);
              window.tdgllayer = null;
              window.mapapi.removeLayer(window.tdglLine);
              return;
            }
            store.setSliderShow(true);

            var url = layers[8].children[0].urls;
            //"https://skyzt.bda.gov.cn/gisserver/tmsserver/chengshiguihua_dikuaibianhao_tms/";

            window.mapapi.removeLayer(window.tdgllayer);
            window.tdgllayer = new ol.layer.Tile({
              source: new ol.source.XYZ({
                projection: "EPSG:4326",
                tileGrid: ol.tilegrid.createXYZ({
                  extent: [50.582, -90, 180, 70.1558],
                }),
                tileUrlFunction: function (tileCoord, pixelRatio, proj) {
                  // return url + (tileCoord[0] - 1) + '/' + tileCoord[1] + '/' + (Math.pow(2, tileCoord[0] - 1) + tileCoord[2]) + '.jpeg';
                  return (
                    url +
                    "/" +
                    (tileCoord[0] - 1) +
                    "/" +
                    tileCoord[1] +
                    "/" +
                    (Math.pow(2, tileCoord[0] - 1) + tileCoord[2]) +
                    ".jpeg"
                  );
                },
              }),
            });
            window.mapapi.addLayer(window.tdgllayer);
            //显示滑动条
            store.setSliderShow(true);
            store.setTdglFlag(true);
            var url = layers[8].children[0].urls;
            //加载地块模型
            window.tdgllayer = new ol.layer.Tile({
              source: new ol.source.TileWMS({
                ratio: 3,
                url: 'https://skyzt.bda.gov.cn//gisserver/wmsserver/chengshiguihua_dikuaibianhao',
                params: {
                  'VERSION': '1.1.1',
                  'SRS': 'EPSG:4326',
                  'FORMAT': 'image/png',
                  'TILED': true,
                  "LAYERS": ''
                }
              })
            })

            // window.tdgllayer = new ol.layer.Tile({
            //   source: new ol.source.XYZ({
            //     projection: "EPSG:4326",
            //     format: new ol.format.MVT(),
            //     tileGrid: ol.tilegrid.createXYZ({
            //       // extent: [-50.582, -90, 180, 70.1558],
            //       extent: [-180, -90, 180, 90]
            //     }),
            //     tilePixelRatio: 3,
            //     tileUrlFunction: function (tileCoord, pixelRatio, proj) {
            //       console.log(tileCoord, '参数')
            //       console.log(Math.pow(2, tileCoord[0]) + tileCoord[2] - 1)
            //       // return url + (tileCoord[0] - 1) + '/' + tileCoord[1] + '/' + (Math.pow(2, tileCoord[0] - 1) + tileCoord[2]) + '.jpeg';
            //       return (
            //         url +
            //         (tileCoord[0]) +
            //         "/" +
            //         tileCoord[1] +
            //         "/" +
            //         (Math.pow(2, tileCoord[0]) + tileCoord[2] - 1) +
            //         ".jpeg"
            //       );

            //     },
            //   }),
            // });

            window.mapapi.addLayer(window.tdgllayer);
            break;
          case 1:
            this.curFuncIndex = -1;
            store.setTdglFlag(false);
            store.setSliderShow(false);
            store.setHistoryShow(true);
            if (window.tdglLayer) {
              store.setSliderShow(false);
              window.mapapi.removeLayer(window.tdgllayer);
            }
            break;
        }
      }

 src/components/sideMenu/layerTreePanel/layerTreePanel2.vue

@@ -2036,7 +2036,7 @@
            return new ol.style.Style({
              image: new ol.style.Icon({
                anchor: [0.5, 1],
                src: "./static/SmartEarthSDK/Workers/image/xzspj/spjk.png",
                src: "./static/SmartEarthSDK/Workers/image/xzspj/camera.png",
              }),
            });
          }

 src/components/sideMenu/sliderAlpha/alpha2.vue

@@ -1,13 +1,6 @@
<template>
  <div class="sliders">
    <el-slider
      v-model="value"
      :max="100"
      :min="0"
      vertical
      height="200px"
      @input="changeSlider"
    >
    <el-slider v-model="value" :max="100" :min="0" vertical height="200px" @input="changeSlider">
    </el-slider>
  </div>
</template>
@@ -21,9 +14,9 @@
  },
  methods: {
    changeSlider(val) {
      console.log(val);
      // window.tdglLayer.item.alpha = val / 100;
      if (window.tdgllayer) {
      window.tdgllayer.state_.layer.setOpacity(val / 100);
      }
    },
  },
};
@@ -36,6 +29,7 @@
  left: 0.15rem;
  z-index: 88;
}

.el-tooltip__popper {
  z-index: 88 !important;
}

 src/components/viewer2.vue

@@ -235,13 +235,13 @@
        id: "cva_c",
        source: wmtsSource2,
      });
      wmtsLayer2.setVisible(false);
      // wmtsLayer2.setVisible(false);
      ////卫星影像
      layers.push(wmtsLayer);
      ////二维地图
      layers.push(wmtsLayer2);
      ////路网
      layers.push(wmtsLayer1);
      // layers.push(wmtsLayer1);

      const map = new ol.Map({
        layers: layers,
@@ -250,10 +250,72 @@
          center: [116.505348, 39.795592],
          projection: "EPSG:4326",
          zoom: 12,
          minZoom: 8.5
        }),
      });

      window.mapapi = map;

      //加载航拍影像
      window.ImageLayer = new ol.layer.Tile({
        id: 'C0698021',
        visible: true,
        source: new ol.source.XYZ({
          wrapX: true,
          url: `${'https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer'}/tile/{z}/{y}/{x}`,
        }),
        projection: new ol.proj.get('EPSG:4326')
      });
      window.mapapi.addLayer(window.ImageLayer);

      //加载高德标注
      window.annotation = new ol.layer.Tile({
        id: '69EB42A8',
        visible: true,
        source: new ol.source.XYZ({
          wrapX: true,
          url: `https://webst02.is.autonavi.com/appmaptile?style=8&x={x}&y={y}&z={z}`,
        }),
        projection: new ol.proj.get('EPSG:4326')
      });
      window.mapapi.addLayer(window.annotation);


      window.hexin = new ol.layer.Tile({
        source: new ol.source.TileWMS({
          ratio: 3,
          url: 'https://skyzt.bda.gov.cn/gisserver/wmsserver/YZ_BJ60',//图层地址
          params: {
            'VERSION': '1.1.1',
            'SRS': 'EPSG:4326',
            'FORMAT': 'image/png',
            'TILED': true,
            "LAYERS": ''
          }
        })
      })
      window.mapapi.addLayer(window.hexin)


      //亦庄新城规划范围
      window.yizhuang = new ol.layer.Tile({
        source: new ol.source.TileWMS({
          ratio: 3,
          url: 'https://skyzt.bda.gov.cn/gisserver/wmsserver/YZ_BJ',//图层地址
          params: {
            'VERSION': '1.1.1',
            'SRS': 'EPSG:4326',
            'FORMAT': 'image/png',
            'TILED': true,
            "LAYERS": ''
          }
        })
      })
      window.mapapi.addLayer(window.yizhuang)




      setClick(true)
      // leftClick()
      // var url =
@@ -447,5 +509,4 @@
.colseBtn img {
  width: 30px;
}

</style>

 src/router/index.js

@@ -24,7 +24,7 @@
    component: index
  },
  {
    path: '/index2',
    path: '/home',
    name: 'index2',
    component: index2
  },

 src/utils/map.js

@@ -447,11 +447,14 @@
            }
            // 土地管理
            if (store.tdglInfo.flag) {

                console.log('坐标', [window.clickPOI.lon, window.clickPOI.lat])

                axios
                    .get(
                        // "http://10.10.4.115:8022/geowinmap_xncs/ds?r=0.9158559377752831&serviceproviderid=map.vectorserviceprovider&serviceid=queryfeature&featcls=225%25E8%258C%2583%25E5%259B%25B4%25E5%2588%2586%25E5%258C%25BA%25E8%25A7%2584%25E5%2588%2592.geojson&lng=" +
                        // window.gisBaseUrl + "yzxncsApi/geowinmap_xncs/ds?r=0.9158559377752831&serviceproviderid=map.vectorserviceprovider&serviceid=queryfeature&featcls=225%25E8%258C%2583%25E5%259B%25B4%25E5%2588%2586%25E5%258C%25BA%25E8%25A7%2584%25E5%2588%2592.geojson&lng=" +
                        window.gisBaseUrl + "cs/geowinmap_xncs/ds?&lng=" +
                        window.gisBaseUrl + "yzxncsApi/geowinmap_xncs/ds?r=0.9158559377752831&serviceproviderid=map.vectorserviceprovider&serviceid=queryfeature&featcls=225%25E8%258C%2583%25E5%259B%25B4%25E5%2588%2586%25E5%258C%25BA%25E8%25A7%2584%25E5%2588%2592.geojson&lng=" +
                        // window.gisBaseUrl + "cs/geowinmap_xncs/ds?&lng=" +
                        window.clickPOI.lon +
                        "&lat=" +
                        window.clickPOI.lat +
@@ -498,8 +501,8 @@
                            axios
                                .get(
                                    // "http://10.10.4.115:8022//poisearch/guihuacon/getInfo?ydbm=" +
                                    // window.gisBaseUrl + "yzxncsApi/poisearch/guihuacon/getInfo?ydbm=" +
                                    window.gisBaseUrl + "cs/poisearch/guihuacon/getInfo?ydbm=" +
                                    window.gisBaseUrl + "yzxncsApi/poisearch/guihuacon/getInfo?ydbm=" +
                                    // window.gisBaseUrl + "cs/poisearch/guihuacon/getInfo?ydbm=" +
                                    response.data.NO
                                )
                                .then(

 src/utils/map2.js

@@ -134,7 +134,7 @@
    )
        // axios.get(window.gisBaseUrl + '/gisserver/wfsserver/qiyelianqiye?version=1.3.0&request=GetFeature&format=json&typename=企业链企业')
        .then(dataSource => {
            console.log(dataSource);
            // console.log(dataSource);
            store.qiyeJsonInfo = dataSource
        })
        .catch((err) => {
@@ -2252,6 +2252,7 @@
                .get(
                    // "http://10.10.4.115:8022/geowinmap_xncs/ds?r=0.9158559377752831&serviceproviderid=map.vectorserviceprovider&serviceid=queryfeature&featcls=225%25E8%258C%2583%25E5%259B%25B4%25E5%2588%2586%25E5%258C%25BA%25E8%25A7%2584%25E5%2588%2592.geojson&lng=" +
                    window.gisBaseUrl + "yzxncsApi/geowinmap_xncs/ds?r=0.9158559377752831&serviceproviderid=map.vectorserviceprovider&serviceid=queryfeature&featcls=225%25E8%258C%2583%25E5%259B%25B4%25E5%2588%2586%25E5%258C%25BA%25E8%25A7%2584%25E5%2588%2592.geojson&lng=" +
                    // window.gisBaseUrl + "cs/geowinmap_xncs/ds?&lng=" +
                    e.coordinate[0] +
                    "&lat=" +
                    e.coordinate[1] +
@@ -2269,26 +2270,28 @@
                    window.tdglLine = new ol.layer.Vector({
                        source: new ol.source.Vector({
                            features: [feature] // 将要素对象加入到图层源中
                        }),
                        style: new ol.style.Style({
                            stroke: new ol.style.Stroke({
                                color: 'red',
                                width: 3
                            }),
                        })
                    });
                    window.mapapi.addLayer(window.tdglLine)


                    axios
                        .get(
                    axios.get(
                            // "http://10.10.4.115:8022//poisearch/guihuacon/getInfo?ydbm=" +
                            window.gisBaseUrl + "yzxncsApi/poisearch/guihuacon/getInfo?ydbm=" +
                            response.data.NO
                        )
                        .then(
                            info => {
                        window.gisBaseUrl + "yzxncsApi/poisearch/guihuacon/getInfo?ydbm=" + response.data.NO
                    ).then((info) => {
                                let data = info.data.data;
                                if (data.yongdishuju === null) {
                                    objdata = {
                                        POITYPE: "NOTDGL",
                                        zwxx: "暂无信息",
                                        lon: window.clickPOI.lon,
                                        lat: window.clickPOI.lat,
                                lon: e.coordinate[0],
                                lat: e.coordinate[1],
                                    }
                                } else {
                                    qiyexinxi = info.data.data.qiyexinxi;
@@ -2365,9 +2368,18 @@
        }

        window.mapapi.forEachFeatureAtPixel(e.pixel, function (feature) {
            console.log(feature.getProperties(), 'aaa');

            //搜索的点位
            if (window.pointArr.length > 0) {
                let obj = feature.getProperties().desc
                objdata = {
                    POITYPE: "POINT",
                    name: obj.name,
                    address: obj.address,
                }
            } else {
            let properties = feature.getProperties().features[0].values_;
            console.log(properties, 'aaa');
            console.log(properties.values_, 'bbb');
            for (const propertyNames in properties) {
                if (propertyNames.indexOf("监控名") !== -1) {
                    // objdata = {
@@ -2388,11 +2400,11 @@
                        center: true,
                        duration: 1000,
                    });
                    layerOpen(properties["JK名称"]._value, {
                        layerOpen(properties["JK名称"], {
                        width: "100%",
                        height: "40%",
                        // offset: [offsetTop + "px", "380px"],
                        url: "../../static/video/video.html?code=" + properties["JK内码"]._value,
                            url: "../../static/video/video.html?code=" + properties["JK内码"],
                        fn: {
                            success: (layero, index) => {
                                SmartEarthPopupData.layerContainer = layero;
@@ -2442,26 +2454,11 @@
                    }
                }
            }

            if (feature && feature.values_.desc) {
                let obj = feature.values_.desc
                objdata = {
                    POITYPE: "POINT",
                    name: obj.name,
                    address: obj.address,
                }


                // if (window.instance) {
                //     window.instance.$destroy();
                // }
                // window.instance = new PoiLayerConstructor({
                //     data: {
                //         list: objdata
                //     }
                // });
                // window.instance.$mount();
            }



            store.setTdglShow(false);
            store.setTdlgInfo({});

 src/utils/poiKeys.js

@@ -44,8 +44,6 @@
    },
    'POINT': {
        名称: 'name',
        经度: 'lon',
        纬度: 'lat',
        地址: 'address'
    }
}

 static/SmartEarthSDK/Workers/image/xzspj/camera.png