From e8ec0a53b3fddeaf0f70ef38abad9a2ad1207c93 Mon Sep 17 00:00:00 2001
From: ZhAkps <46207005+ZhAkps@users.noreply.github.com>
Date: 星期二, 06 二月 2024 15:39:02 +0800
Subject: [PATCH] Merge branch 'master' of http://106.120.22.35:48888/r/PM20221203225_MobileWeb
---
src/components/viewer2.vue | 132 ++++++++++++++++++++++++++++++++------------
1 files changed, 96 insertions(+), 36 deletions(-)
diff --git a/src/components/viewer2.vue b/src/components/viewer2.vue
index 158d9f6..17b3c6f 100644
--- a/src/components/viewer2.vue
+++ b/src/components/viewer2.vue
@@ -3,6 +3,14 @@
<!-- openlayer -->
<div id="openlayerContainer" @click="clicktoclose"></div>
+ <div id="ponitPanel">
+ <div class="title">鐐逛綅璇︽儏</div>
+ <div class="content">
+
+ </div>
+
+ </div>
+
<!-- 椤甸潰鏍囬 -->
<div class="titleBg">
<img src="@/assets/img/title/title.png" />
@@ -52,11 +60,12 @@
<!-- 鍦熷湴绠＄悊寮圭獥 -->
<my-land-admin-info></my-land-admin-info>
<my-slider></my-slider>
+ <my-poplayer></my-poplayer>
</div>
</template>
<script>
import store from "@/utils/store2.js";
-
+import { setClick } from '@/utils/map2.js'
import _GLOBAL from "@/assets/GLOBAL2";
import { leftClick, loadLayer } from "@/utils/map.js";
import leftBottom from "@/components/leftMenu/bottom2.vue";
@@ -66,9 +75,9 @@
import NavigationBar from "./rightNavigation/NavigationBar2.vue";
import layertree from "@/components/rightMenu/layerTree2.vue";
import settingPanel from "./sideMenu/settingMenu/main.vue";
-import collectionPanel from "./sideMenu/collectionMenu/main.vue";
+import collectionPanel from "./sideMenu/collectionMenu/main2.vue";
import directionPanel from "./sideMenu/directionMenu/main.vue";
-import addCollectionPanel from "./sideMenu/addCollectionMenu/main.vue";
+import addCollectionPanel from "./sideMenu/addCollectionMenu/main2.vue";
import statisticsPanel from "./sideMenu/statisticsMenu/main.vue";
import manholePanel from "./sideMenu/manholeStatistics/main.vue";
import videoPanel from "./sideMenu/videoStatistics/main.vue";
@@ -77,16 +86,19 @@
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 Axios from "axios";
-import Map from "ol/Map.js";
-import TileLayer from "ol/layer/Tile.js";
-import View from "ol/View.js";
-import { get as getProjection, getTransform } from "ol/proj";
-import { getWidth, getTopLeft, applyTransform } from "ol/extent";
-import WMTS from "ol/source/WMTS";
-import WMTSTileGrid from "ol/tilegrid/WMTS";
+// import Map from "ol/Map.js";
+// import TileLayer from "ol/layer/Tile.js";
+// import View from "ol/View.js";
+// import { get as getProjection, getTransform } from "ol/proj";
+// import { getWidth, getTopLeft, applyTransform } from "ol/extent";
+// import WMTS from "ol/source/WMTS";
+// import WMTSTileGrid from "ol/tilegrid/WMTS";
+// import XYZ from "ol/source/XYZ";
+// import {createXYZ} from "ol/tilegrid";
export default {
name: "viewer2",
@@ -110,6 +122,7 @@
"my-history": history,
"my-land-admin-info": landAdminInfo,
"my-slider": sliderAlpha,
+ "my-poplayer": poplayer
},
data() {
return {
@@ -132,12 +145,12 @@
state: store.history,
};
},
- created() {},
+ created() { },
mounted() {
this.$nextTick(function () {
console.log("openlayer init");
- Map.prototype.getLayerByName = function (name) {
+ ol.Map.prototype.getLayerByName = function (name) {
var layer;
this.getLayers().array_.forEach(function (lyr) {
if (name == lyr.values_.name) {
@@ -157,13 +170,13 @@
let _key = TDTKey;
let _matrixSets = options.matrixSets;
- let projection = getProjection(_proj);
+ let projection = ol.proj.get(_proj);
let projectionExtent = projection.getExtent();
- let origin = projectionExtent ? getTopLeft(projectionExtent) : [-180, 90];
- let fromLonLat = getTransform("EPSG:4326", projection);
+ let origin = projectionExtent ? ol.extent.getTopLeft(projectionExtent) : [-180, 90];
+ let fromLonLat = ol.proj.getTransform("EPSG:4326", projection);
let width = projectionExtent
- ? getWidth(projectionExtent)
- : getWidth(applyTransform([-180.0, -90.0, 180.0, 90.0], fromLonLat));
+ ? ol.extent.getWidth(projectionExtent)
+ : ol.extent.getWidth(ol.extent.applyTransform([-180.0, -90.0, 180.0, 90.0], fromLonLat));
let resolutions = [];
let matrixIds = [];
@@ -171,7 +184,7 @@
resolutions[z] = width / (256 * Math.pow(2, z));
matrixIds[z] = z;
}
- let wmtsTileGrid = new WMTSTileGrid({
+ let wmtsTileGrid = new ol.tilegrid.WMTS({
origin: origin,
resolutions: resolutions,
matrixIds: matrixIds,
@@ -180,7 +193,7 @@
"url:",
`${tiandituUrl}/${_layer}_${_matrixSets}/wmts?tk=${_key}`
);
- let wmtsSource = new WMTS({
+ let wmtsSource = new ol.source.WMTS({
url: `${tiandituUrl}/${_layer}_${_matrixSets}/wmts?tk=${_key}`,
layer: _layer,
version: "1.0.0",
@@ -191,13 +204,13 @@
style: "default",
tileGrid: wmtsTileGrid,
});
- let wmtsLayer = new TileLayer({
+ let wmtsLayer = new ol.layer.Tile({
name: "褰卞儚鍦板浘",
id: _layer + "_" + _matrixSets,
source: wmtsSource,
});
- let wmtsSource1 = new WMTS({
+ let wmtsSource1 = new ol.source.WMTS({
url: `${tiandituUrl}/cia_${_matrixSets}/wmts?tk=${_key}`,
layer: "cia",
version: "1.0.0",
@@ -208,13 +221,13 @@
style: "default",
tileGrid: wmtsTileGrid,
});
- let wmtsLayer1 = new TileLayer({
+ let wmtsLayer1 = new ol.layer.Tile({
name: "璺綉鍥惧眰",
id: "cia_c",
source: wmtsSource1,
});
- let wmtsSource2 = new WMTS({
+ let wmtsSource2 = new ol.source.WMTS({
url: `${tiandituUrl}/vec_c/wmts?tk=${_key}`,
layer: "vec",
version: "1.0.0",
@@ -225,7 +238,7 @@
style: "default",
tileGrid: wmtsTileGrid,
});
- let wmtsLayer2 = new TileLayer({
+ let wmtsLayer2 = new ol.layer.Tile({
name: "浜岀淮鍦板浘",
id: "cva_c",
source: wmtsSource2,
@@ -238,10 +251,10 @@
////璺綉
layers.push(wmtsLayer1);
- const map = new Map({
+ const map = new ol.Map({
layers: layers,
target: "openlayerContainer",
- view: new View({
+ view: new ol.View({
center: [116.505348, 39.795592],
projection: "EPSG:4326",
zoom: 12,
@@ -249,6 +262,31 @@
});
window.map = map;
+ setClick(true)
+ // 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.map.addLayer(tmslayer);
window.layerOpen = function (name, options) {
layuiLayer.close(SmartEarthPopupData.layerProp);
@@ -320,16 +358,16 @@
// console.log("鍙屽嚮");
// Viewer.camera.zoomIn();
// console.log(window.clickPOI);
- let p = sgworld.Navigate.getDegrees();
+ // 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,
- });
+ // Viewer.camera.flyTo({
+ // destination: Cesium.Cartesian3.fromDegrees(
+ // window.clickPOI.lon,
+ // window.clickPOI.lat,
+ // p.height / 1.8
+ // ),
+ // duration: 1.0,
+ // });
}
this.count = 0;
}, 300);
@@ -366,7 +404,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);
});
@@ -381,6 +419,7 @@
height: 100%;
background: black;
position: absolute !important;
+ z-index: 0;
}
.titleBg {
@@ -404,13 +443,34 @@
.bottomLeft {
display: none;
}
+
.colseBtn {
position: absolute;
z-index: 2;
top: 0.55rem;
left: 0.2rem;
}
+
.colseBtn img {
width: 30px;
}
+
+#ponitPanel {
+ 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;
+ box-sizing: border-box;
+ font-size: 16px;
+ pointer-events: all;
+ position: absolute;
+ bottom: 12px;
+ left: -50px;
+}
+
+
</style>
--
Gitblit v1.9.3