北京经济技术开发区经开区虚拟城市项目-【前端】-移动端Web
少年
2024-02-06 a6069df12050e0bff8aaa2d530b9cc8d348910ca
src/components/viewer2.vue
@@ -4,8 +4,9 @@
    <div id="openlayerContainer" @click="clicktoclose"></div>
    <div id="ponitPanel">
      <div id="ponitPanel-close" @click.stop="closehandle"></div>
      <div class="title">点位详情</div>
      <div class="content">
      <div id="ponitPanel-content">
      </div>
@@ -65,9 +66,9 @@
</template>
<script>
import store from "@/utils/store2.js";
import { setClick } from '@/utils/map2.js'
import { setClick,leftClick } from '@/utils/map2.js'
import _GLOBAL from "@/assets/GLOBAL2";
import { leftClick, loadLayer } from "@/utils/map.js";
// import { leftClick, loadLayer } from "@/utils/map.js";
import leftBottom from "@/components/leftMenu/bottom2.vue";
import rightBottom from "@/components/rightMenu/bottom2.vue";
import sousuo from "@/components/leftMenu/sousuo2.vue";
@@ -85,9 +86,9 @@
import roamPanel from "./sideMenu/roamPanel/main.vue";
import layerTreePanel from "./sideMenu/layerTreePanel/main2.vue";
import history from "./poplayer/history.vue";
import landAdminInfo from "./poplayer/landAdmin.vue";
import poplayer from "./poplayer/main.vue";
import sliderAlpha from "./sideMenu/sliderAlpha/main.vue";
import landAdminInfo from "./poplayer/landAdmin2.vue";
import poplayer from "./poplayer/main2.vue";
import sliderAlpha from "./sideMenu/sliderAlpha/main2.vue";
import Axios from "axios";
// import Map from "ol/Map.js";
@@ -184,7 +185,7 @@
        resolutions[z] = width / (256 * Math.pow(2, z));
        matrixIds[z] = z;
      }
      let wmtsTileGrid = new  ol.tilegrid.WMTS({
      let wmtsTileGrid = new ol.tilegrid.WMTS({
        origin: origin,
        resolutions: resolutions,
        matrixIds: matrixIds,
@@ -263,9 +264,10 @@
      window.map = 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,
@@ -418,7 +420,7 @@
  width: 100%;
  height: 100%;
  background: black;
  position: absolute !important;
  /* position: absolute !important; */
  z-index: 0;
}
@@ -456,6 +458,7 @@
}
#ponitPanel {
  /* display: none; */
  width: 80vw;
  background-repeat: no-repeat;
  background-size: 100% 100%;
@@ -464,13 +467,55 @@
  color: #fff;
  font-family: SourceHanSansSC-R;
  padding: 10px 5px 10px 5px;
  box-sizing: border-box;
  font-size: 16px;
  pointer-events: all;
  position: absolute;
  bottom: 12px;
  left: -50px;
}
.title {
  width: 100%;
  text-align: center;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 4px;
  padding-left: 26px;
}
#ponitPanel-close {
  pointer-events: all;
  width: 28px;
  height: 28px;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-image: url("./poplayer/img/close.png");
  margin-top: 8px;
  margin-right: 5px;
  float: right;
  cursor: pointer;
}
#ponitPanel-content {
  width: 100%;
  margin: auto;
}
.ponitPanel-item {
  width: 90%;
  overflow: hidden;
  margin-bottom: 7px;
  margin-left: 25px;
  margin-right: 20px;
  word-break: break-all;
}
.ponitPanel-name {
  /* min-width: 100px; */
  float: left;
}
.ponitPanel-value {
  max-width: 400px;
  float: left;
  color: aqua;
}
</style>