From 0350f3c02209ee8b62f818810eaa663289158843 Mon Sep 17 00:00:00 2001 From: 少年 <1392120328@qq.com> Date: 星期二, 06 二月 2024 10:38:57 +0800 Subject: [PATCH] Merge branch 'master' of http://106.120.22.35:48888/r/PM20221203225_MobileWeb --- src/components/viewer2.vue | 128 +++++++++++++++++++++++++----------------- 1 files changed, 77 insertions(+), 51 deletions(-) diff --git a/src/components/viewer2.vue b/src/components/viewer2.vue index 5937e50..158d9f6 100644 --- a/src/components/viewer2.vue +++ b/src/components/viewer2.vue @@ -14,9 +14,9 @@ <img class="searchBtn" src="@/assets/closeinput1.png" /> </div> --> <!-- 鍙充晶瀵艰埅妗� --> - <!-- <my-navigation-bar></my-navigation-bar> --> + <my-navigation-bar></my-navigation-bar> <!-- 鎼滅储妗� --> - <!-- <my-sousuo v-if="!state.show" v-show="childrendata.ssval"></my-sousuo> --> + <my-sousuo v-if="!state.show" v-show="childrendata.ssval"></my-sousuo> <!-- 鍙充笂蹇嵎鍖哄煙锛堝伐绋嬫爲銆佺┖闂村垎鏋愶級 --> <!-- <div class="right-top"> <my-layertree :rightshowzy="childrendata"></my-layertree> @@ -24,47 +24,47 @@ <!-- 鍘熷乏涓嬭彍鍗� --> <!-- <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> --> + <my-right-bottom :test="childrendata"></my-right-bottom> <!-- 鍚勭闈㈡澘 --> <!-- 璁剧疆闈㈡澘 --> - <!-- <my-setting-panel></my-setting-panel> --> + <my-setting-panel></my-setting-panel> <!-- 浣嶇疆闈㈡澘 --> - <!-- <my-collection-panel></my-collection-panel> --> + <my-collection-panel></my-collection-panel> <!-- 鎸囧寳閽堥潰鏉� --> <!-- <my-direction-panel></my-direction-panel> --> <!-- 鏂板鏀惰棌闈㈡澘 --> - <!-- <my-add-collection-panel></my-add-collection-panel> --> + <my-add-collection-panel></my-add-collection-panel> <!-- 绐ㄤ簳銆佹憚鍍忓ご缁熻闈㈡澘 --> - <!-- <my-statistics-panel></my-statistics-panel> --> + <my-statistics-panel></my-statistics-panel> <!-- 绐ㄤ簳缁熻鍒嗘瀽闈㈡澘 --> - <!-- <my-manhole-panel></my-manhole-panel> --> + <my-manhole-panel></my-manhole-panel> <!-- 鎽勫儚澶寸粺璁″垎鏋愰潰鏉� --> - <!-- <my-video-panel></my-video-panel> --> + <my-video-panel></my-video-panel> <!-- 鍥惧眰闈㈡澘 --> - <!-- <my-layer-panel></my-layer-panel> --> + <my-layer-panel></my-layer-panel> <!-- 婕父闈㈡澘 --> - <!-- <my-roam-panel></my-roam-panel> --> + <my-roam-panel></my-roam-panel> <!-- 鍥惧眰鏍戦潰鏉� --> - <!-- <my-layer-tree-panel></my-layer-tree-panel> --> + <my-layer-tree-panel></my-layer-tree-panel> <!-- 鍦熷湴绠$悊寮圭獥 --> - <!-- <my-land-admin-info></my-land-admin-info> - <my-slider></my-slider> --> + <my-land-admin-info></my-land-admin-info> + <my-slider></my-slider> </div> </template> <script> -import store from "@/utils/store.js"; +import store from "@/utils/store2.js"; -import _GLOBAL from "@/assets/GLOBAL"; +import _GLOBAL from "@/assets/GLOBAL2"; import { leftClick, loadLayer } from "@/utils/map.js"; -import leftBottom from "@/components/leftMenu/bottom.vue"; -import rightBottom from "@/components/rightMenu/bottom.vue"; -import sousuo from "@/components/leftMenu/sousuo.vue"; +import leftBottom from "@/components/leftMenu/bottom2.vue"; +import rightBottom from "@/components/rightMenu/bottom2.vue"; +import sousuo from "@/components/leftMenu/sousuo2.vue"; import menu from "@/components/menu/menu.vue"; -import NavigationBar from "./rightNavigation/NavigationBar.vue"; -import layertree from "@/components/rightMenu/layerTree.vue"; +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 directionPanel from "./sideMenu/directionMenu/main.vue"; @@ -74,7 +74,7 @@ import videoPanel from "./sideMenu/videoStatistics/main.vue"; import layerPanel from "./sideMenu/layerMenu/main2.vue"; import roamPanel from "./sideMenu/roamPanel/main.vue"; -import layerTreePanel from "./sideMenu/layerTreePanel/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"; @@ -83,19 +83,10 @@ 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 { 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"; export default { name: "viewer2", @@ -144,19 +135,28 @@ created() {}, mounted() { this.$nextTick(function () { - - console.log('openlayer init'); + console.log("openlayer init"); + + Map.prototype.getLayerByName = function (name) { + var layer; + this.getLayers().array_.forEach(function (lyr) { + if (name == lyr.values_.name) { + layer = lyr; + } + }); + return layer; + }; const layers = []; - const TDTKey = 'f234b950740b8c2e0d9959a51c169d21'; - const tiandituUrl = 'http://t0.tianditu.gov.cn'; - let options = {proj:'EPSG:4326',layer:'cia',matrixSets:"c"}; + const TDTKey = "f234b950740b8c2e0d9959a51c169d21"; + const tiandituUrl = "http://t0.tianditu.gov.cn"; + let options = { proj: "EPSG:4326", layer: "img", matrixSets: "c" }; let _proj = options.proj; let _layer = options.layer; let _key = TDTKey; let _matrixSets = options.matrixSets; - + let projection = getProjection(_proj); let projectionExtent = projection.getExtent(); let origin = projectionExtent ? getTopLeft(projectionExtent) : [-180, 90]; @@ -176,7 +176,10 @@ resolutions: resolutions, matrixIds: matrixIds, }); - console.log('url:',`${tiandituUrl}/${_layer}_${_matrixSets}/wmts?tk=${_key}`); + console.log( + "url:", + `${tiandituUrl}/${_layer}_${_matrixSets}/wmts?tk=${_key}` + ); let wmtsSource = new WMTS({ url: `${tiandituUrl}/${_layer}_${_matrixSets}/wmts?tk=${_key}`, layer: _layer, @@ -189,13 +192,14 @@ tileGrid: wmtsTileGrid, }); let wmtsLayer = new TileLayer({ + name: "褰卞儚鍦板浘", id: _layer + "_" + _matrixSets, source: wmtsSource, }); let wmtsSource1 = new WMTS({ - url: `${tiandituUrl}/img_${_matrixSets}/wmts?tk=${_key}`, - layer: 'img', + url: `${tiandituUrl}/cia_${_matrixSets}/wmts?tk=${_key}`, + layer: "cia", version: "1.0.0", matrixSet: _matrixSets, format: "tiles", @@ -205,24 +209,46 @@ tileGrid: wmtsTileGrid, }); let wmtsLayer1 = new TileLayer({ - id: _layer + "_" + _matrixSets, + name: "璺綉鍥惧眰", + id: "cia_c", source: wmtsSource1, }); - layers.push(wmtsLayer1); + + let wmtsSource2 = new WMTS({ + url: `${tiandituUrl}/vec_c/wmts?tk=${_key}`, + layer: "vec", + version: "1.0.0", + matrixSet: _matrixSets, + format: "tiles", + projection: projection, + requestEncoding: "KVP", + style: "default", + tileGrid: wmtsTileGrid, + }); + let wmtsLayer2 = new TileLayer({ + name: "浜岀淮鍦板浘", + id: "cva_c", + source: wmtsSource2, + }); + wmtsLayer2.setVisible(false); + ////鍗槦褰卞儚 layers.push(wmtsLayer); - - + ////浜岀淮鍦板浘 + layers.push(wmtsLayer2); + ////璺綉 + layers.push(wmtsLayer1); const map = new Map({ layers: layers, target: "openlayerContainer", view: new View({ - center: [-6655.5402445057125, 6709968.258934638], + center: [116.505348, 39.795592], + projection: "EPSG:4326", zoom: 12, }), }); - + window.map = map; window.layerOpen = function (name, options) { layuiLayer.close(SmartEarthPopupData.layerProp); -- Gitblit v1.9.3