youhua

少年

2024-03-05 d46ebfb71da0148dcc2724024cf7b053d784f299

 src/components/viewer2.vue

@@ -4,9 +4,9 @@
    <div id="openlayerContainer" @click="clicktoclose"></div>

    <!-- 页面标题 -->
    <div class="titleBg">
    <!-- <div class="titleBg">
      <img src="@/assets/img/title/title.png" />
    </div>
    </div> -->
    <!-- 历史影像 -->
    <my-history v-if="state.show"></my-history>
    <!-- 历史影像关闭按钮 -->
@@ -24,7 +24,7 @@
    <!-- 原左下菜单 -->
    <!-- <my-menu v-on:getshowsta="datafromchild" ref="menu"></my-menu> -->
    <!-- 左下快捷区域（复位、指北等） -->
    <my-left-bottom :test="childrendata"></my-left-bottom>
    <!-- <my-left-bottom :test="childrendata"></my-left-bottom> -->
    <!-- 右下快捷区域（放大缩小） -->
    <my-right-bottom :test="childrendata"></my-right-bottom>

@@ -57,7 +57,7 @@
</template>
<script>
import store from "@/utils/store2.js";
import { setClick,leftClick } from '@/utils/map2.js'
import { setClick, leftClick } from "@/utils/map2.js";
import _GLOBAL from "@/assets/GLOBAL2";
// import { leftClick, loadLayer } from "@/utils/map.js";
import leftBottom from "@/components/leftMenu/bottom2.vue";
@@ -81,7 +81,15 @@
import mainPoplayer from "./poplayer/poplayer2.vue";
import sliderAlpha from "./sideMenu/sliderAlpha/main2.vue";
import Axios from "axios";

import {
  addImageLayer,
  addAnnotationLayer,
  addHxLayer,
  addYzLayer,
  loadBaseMap,
  listenDirection,
  getCurrentPosition
} from "@/utils/tool";
// import Map from "ol/Map.js";
// import TileLayer from "ol/layer/Tile.js";
// import View from "ol/View.js";
@@ -114,7 +122,7 @@
    "my-history": history,
    "my-land-admin-info": landAdminInfo,
    "my-slider": sliderAlpha,
    "my-poplayer":mainPoplayer
    "my-poplayer": mainPoplayer,
  },
  data() {
    return {
@@ -137,11 +145,9 @@
      state: store.history,
    };
  },
  created() { },
  created() {},
  mounted() {
    this.$nextTick(function () {
      console.log("openlayer init");

      ol.Map.prototype.getLayerByName = function (name) {
        var layer;
        this.getLayers().array_.forEach(function (lyr) {
@@ -164,11 +170,15 @@

      let projection = ol.proj.get(_proj);
      let projectionExtent = projection.getExtent();
      let origin = projectionExtent ? ol.extent.getTopLeft(projectionExtent) : [-180, 90];
      let origin = projectionExtent
        ? ol.extent.getTopLeft(projectionExtent)
        : [-180, 90];
      let fromLonLat = ol.proj.getTransform("EPSG:4326", projection);
      let width = projectionExtent
        ? ol.extent.getWidth(projectionExtent)
        : ol.extent.getWidth(ol.extent.applyTransform([-180.0, -90.0, 180.0, 90.0], fromLonLat));
        : ol.extent.getWidth(
            ol.extent.applyTransform([-180.0, -90.0, 180.0, 90.0], fromLonLat)
          );

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

      const map = new ol.Map({
        layers: layers,
@@ -250,36 +260,25 @@
          center: [116.505348, 39.795592],
          projection: "EPSG:4326",
          zoom: 12,
          minZoom: 9.5,
          enableRotation: false,
        }),
      });

      window.mapapi = map;
      setClick(true)
      // leftClick()
      // var url =
      //   "https://skyzt.bda.gov.cn/gisserver/tmsserver/chengshiguihua_dikuaibianhao_tms/";

      // var tmslayer = new ol.layer.Tile({
      //   source: new ol.source.XYZ({
      //     projection: projection,
      //     tileGrid: ol.tilegrid.createXYZ({
      //       extent: [50.731, -90, 180, 70.0478],
      //     }),
      //     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(tmslayer);
      addImageLayer();
      addAnnotationLayer();
      addHxLayer();
      addYzLayer();

      setClick(true);

      getCurrentPosition();
      listenDirection();


      // leftClick()

      window.layerOpen = function (name, options) {
        layuiLayer.close(SmartEarthPopupData.layerProp);
@@ -397,7 +396,7 @@
      console.log(window.gisBaseUrl);
      Axios.get(
        window.gisBaseUrl +
        "/gisserver/wfsserver/qiyelianqiye?version=1.3.0&request=GetFeature&format=json&typename=企业链企业"
          "/gisserver/wfsserver/qiyelianqiye?version=1.3.0&request=GetFeature&format=json&typename=企业链企业"
      ).then((res) => {
        console.log(res);
      });
@@ -447,5 +446,4 @@
.colseBtn img {
  width: 30px;
}

</style>