From 26385d2c91d763259eb1ef55c3255e5ca01717a5 Mon Sep 17 00:00:00 2001 From: ZhAkps <46207005+ZhAkps@users.noreply.github.com> Date: 星期二, 06 二月 2024 18:18:08 +0800 Subject: [PATCH] Merge branch 'master' of http://106.120.22.35:48888/r/PM20221203225_MobileWeb --- src/components/viewer2.vue | 115 +++++++++++++++++++++++++++++++++++++-------------------- 1 files changed, 75 insertions(+), 40 deletions(-) diff --git a/src/components/viewer2.vue b/src/components/viewer2.vue index 158d9f6..65aad7c 100644 --- a/src/components/viewer2.vue +++ b/src/components/viewer2.vue @@ -52,13 +52,14 @@ <!-- 鍦熷湴绠$悊寮圭獥 --> <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,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"; @@ -66,9 +67,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"; @@ -76,17 +77,20 @@ 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 sliderAlpha from "./sideMenu/sliderAlpha/main.vue"; +import landAdminInfo from "./poplayer/landAdmin2.vue"; +import mainPoplayer from "./poplayer/poplayer2.vue"; +import sliderAlpha from "./sideMenu/sliderAlpha/main2.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 +114,7 @@ "my-history": history, "my-land-admin-info": landAdminInfo, "my-slider": sliderAlpha, + "my-poplayer":mainPoplayer }, data() { return { @@ -132,12 +137,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 +162,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 +176,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 +185,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 +196,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 +213,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 +230,7 @@ style: "default", tileGrid: wmtsTileGrid, }); - let wmtsLayer2 = new TileLayer({ + let wmtsLayer2 = new ol.layer.Tile({ name: "浜岀淮鍦板浘", id: "cva_c", source: wmtsSource2, @@ -238,10 +243,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 +254,32 @@ }); 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, + // 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 +351,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 +397,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); }); @@ -380,7 +411,8 @@ width: 100%; height: 100%; background: black; - position: absolute !important; + /* position: absolute !important; */ + z-index: 0; } .titleBg { @@ -404,13 +436,16 @@ .bottomLeft { display: none; } + .colseBtn { position: absolute; z-index: 2; top: 0.55rem; left: 0.2rem; } + .colseBtn img { width: 30px; } + </style> -- Gitblit v1.9.3