From 065669d31914a2f65c48d351417f48e49bd79c0c Mon Sep 17 00:00:00 2001
From: lixuliang <lixuliang_hd@126.com>
Date: 星期三, 13 三月 2024 11:30:46 +0800
Subject: [PATCH] Merge branch 'master' of http://103.135.160.14:9034/r/PM20221203225_MobileWeb
---
src/components/viewer2.vue | 229 ++++++++++++++++++++-------------------------------------
1 files changed, 81 insertions(+), 148 deletions(-)
diff --git a/src/components/viewer2.vue b/src/components/viewer2.vue
index 2358e2a..4a27409 100644
--- a/src/components/viewer2.vue
+++ b/src/components/viewer2.vue
@@ -3,21 +3,12 @@
<!-- openlayer -->
<div id="openlayerContainer" @click="clicktoclose"></div>
- <div id="ponitPanel">
- <div id="ponitPanel-close" @click.stop="closehandle"></div>
- <div class="title">鐐逛綅璇︽儏</div>
- <div id="ponitPanel-content">
-
- </div>
-
- </div>
-
<!-- 椤甸潰鏍囬 -->
- <div class="titleBg">
+ <!-- <div class="titleBg">
<img src="@/assets/img/title/title.png" />
- </div>
+ </div> -->
<!-- 鍘嗗彶褰卞儚 -->
- <!-- <my-history v-if="state.show"></my-history> -->
+ <my-history v-if="state.show"></my-history>
<!-- 鍘嗗彶褰卞儚鍏抽棴鎸夐挳 -->
<!-- <div class="colseBtn" v-if="state.show" @click="closeHistory(false)">
<img class="searchBtn" src="@/assets/closeinput1.png" />
@@ -33,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>
@@ -66,7 +57,7 @@
</template>
<script>
import store from "@/utils/store2.js";
-import { setClick,leftClick } from '@/utils/map2.js'
+import { setClick, leftClick, touchClick } from "@/utils/map2.js";
import _GLOBAL from "@/assets/GLOBAL2";
// import { leftClick, loadLayer } from "@/utils/map.js";
import leftBottom from "@/components/leftMenu/bottom2.vue";
@@ -85,12 +76,21 @@
import layerPanel from "./sideMenu/layerMenu/main2.vue";
import roamPanel from "./sideMenu/roamPanel/main.vue";
import layerTreePanel from "./sideMenu/layerTreePanel/main2.vue";
-import history from "./poplayer/history.vue";
+import history from "./poplayer/history2.vue";
import landAdminInfo from "./poplayer/landAdmin2.vue";
-import poplayer from "./poplayer/main2.vue";
+import mainPoplayer from "./poplayer/poplayer2.vue";
import sliderAlpha from "./sideMenu/sliderAlpha/main2.vue";
import Axios from "axios";
-
+import {
+ addImageLayer,
+ addAnnotationLayer,
+ addHxLayer,
+ addYzLayer,
+ loadBaseMap,
+ loadGeoMap,
+ listenDirection,
+ getCurrentPosition
+} from "@/utils/tool";
// import Map from "ol/Map.js";
// import TileLayer from "ol/layer/Tile.js";
// import View from "ol/View.js";
@@ -123,7 +123,7 @@
"my-history": history,
"my-land-admin-info": landAdminInfo,
"my-slider": sliderAlpha,
- "my-poplayer": poplayer
+ "my-poplayer": mainPoplayer,
},
data() {
return {
@@ -149,8 +149,6 @@
created() { },
mounted() {
this.$nextTick(function () {
- console.log("openlayer init");
-
ol.Map.prototype.getLayerByName = function (name) {
var layer;
this.getLayers().array_.forEach(function (lyr) {
@@ -165,7 +163,7 @@
const TDTKey = "f234b950740b8c2e0d9959a51c169d21";
const tiandituUrl = "http://t0.tianditu.gov.cn";
- let options = { proj: "EPSG:4326", layer: "img", matrixSets: "c" };
+ let options = { proj: "EPSG:3857", layer: "img", matrixSets: "c" };
let _proj = options.proj;
let _layer = options.layer;
let _key = TDTKey;
@@ -173,11 +171,15 @@
let projection = ol.proj.get(_proj);
let projectionExtent = projection.getExtent();
- let origin = projectionExtent ? ol.extent.getTopLeft(projectionExtent) : [-180, 90];
- let fromLonLat = ol.proj.getTransform("EPSG:4326", projection);
+ let origin = projectionExtent
+ ? ol.extent.getTopLeft(projectionExtent)
+ : [-180, 90];
+ let fromLonLat = ol.proj.getTransform("EPSG:3857", 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 = [];
@@ -244,51 +246,44 @@
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,
target: "openlayerContainer",
view: new ol.View({
- center: [116.505348, 39.795592],
- projection: "EPSG:4326",
- zoom: 12,
+ center: ol.proj.fromLonLat([116.505348, 39.795592]),
+ projection: "EPSG:3857",
+ zoom: 11.5,
+ minZoom: 7,
+ maxZoom: 19.5,
+ enableRotation: false,
+ // constrainResolution: true,
+ smoothResolutionConstraint: false,
}),
});
- window.map = map;
- setClick(true)
- leftClick()
- // var url =
- // "https://skyzt.bda.gov.cn/gisserver/tmsserver/chengshiguihua_dikuaibianhao_tms/";
+ window.mapapi = map;
+ // addImageLayer();
+ // addAnnotationLayer();
+ window.mapapi.getView().setZoom(14);
+ loadGeoMap();
+ loadBaseMap();
+ addHxLayer();
+ addYzLayer();
- // 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.map.addLayer(tmslayer);
+ setClick(true);
+ touchClick();
+
+ getCurrentPosition();
+ listenDirection();
+ // leftClick()
window.layerOpen = function (name, options) {
layuiLayer.close(SmartEarthPopupData.layerProp);
@@ -346,34 +341,34 @@
},
methods: {
clicktoclose() {
- clearTimeout(this.timer);
- this.timer = setTimeout(() => {
- this.count++;
- if (this.count == 2) {
- // console.log("鍗曞嚮浜嬩欢");
- // 鍏抽棴鎵�鏈夊脊绐�
- //this.$refs.menu.closeall();
- // 娓呴櫎瀹氫綅涓殑浣嶇疆鏍囪
- //this.$refs.menu.clearFlyPoint();
- } else {
- // 鎵ц鏀惧ぇ鎿嶄綔
- // console.log("鍙屽嚮");
- // Viewer.camera.zoomIn();
- // console.log(window.clickPOI);
- // let p = sgworld.Navigate.getDegrees();
- // console.log(p);
- // Viewer.camera.flyTo({
- // destination: Cesium.Cartesian3.fromDegrees(
- // window.clickPOI.lon,
- // window.clickPOI.lat,
- // p.height / 1.8
- // ),
- // duration: 1.0,
- // });
- }
- this.count = 0;
- }, 300);
- this.count++;
+ // clearTimeout(this.timer);
+ // this.timer = setTimeout(() => {
+ // this.count++;
+ // if (this.count == 2) {
+ // // console.log("鍗曞嚮浜嬩欢");
+ // // 鍏抽棴鎵�鏈夊脊绐�
+ // //this.$refs.menu.closeall();
+ // // 娓呴櫎瀹氫綅涓殑浣嶇疆鏍囪
+ // //this.$refs.menu.clearFlyPoint();
+ // } else {
+ // // 鎵ц鏀惧ぇ鎿嶄綔
+ // // console.log("鍙屽嚮");
+ // // Viewer.camera.zoomIn();
+ // // console.log(window.clickPOI);
+ // // let p = sgworld.Navigate.getDegrees();
+ // // console.log(p);
+ // // Viewer.camera.flyTo({
+ // // destination: Cesium.Cartesian3.fromDegrees(
+ // // window.clickPOI.lon,
+ // // window.clickPOI.lat,
+ // // p.height / 1.8
+ // // ),
+ // // duration: 1.0,
+ // // });
+ // }
+ // this.count = 0;
+ // }, 300);
+ // this.count++;
},
datafromchild(data) {
for (var i in data) {
@@ -455,67 +450,5 @@
.colseBtn img {
width: 30px;
-}
-
-#ponitPanel {
- /* display: none; */
- width: 80vw;
- background-repeat: no-repeat;
- background-size: 100% 100%;
- background-image: url("./poplayer/img/bg.png");
- z-index: 999;
- color: #fff;
- font-family: SourceHanSansSC-R;
- padding: 10px 5px 10px 5px;
- font-size: 16px;
- pointer-events: all;
-}
-
-.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>
--
Gitblit v1.9.3