From 09f448bc9dec772dafaeb04f0c60a0d722035226 Mon Sep 17 00:00:00 2001 From: lixuliang <lixuliang_hd@126.com> Date: 星期五, 26 四月 2024 13:53:25 +0800 Subject: [PATCH] 路由跳转三维 --- src/components/sideMenu/layerMenu/layerPanel2.vue | 158 +++++++++++++++++++++++++++++++--------------------- 1 files changed, 94 insertions(+), 64 deletions(-) diff --git a/src/components/sideMenu/layerMenu/layerPanel2.vue b/src/components/sideMenu/layerMenu/layerPanel2.vue index 571844b..274089c 100644 --- a/src/components/sideMenu/layerMenu/layerPanel2.vue +++ b/src/components/sideMenu/layerMenu/layerPanel2.vue @@ -67,6 +67,7 @@ funcValue.name }}</span> </div> + <!-- <div style="height: 0" class="layerItem" v-for="n in 3" :key="n"></div> --> </div> <!-- <div class="container"> <div @@ -151,7 +152,15 @@ src: require("@/assets/img/layer/yxdt.png"), }, ], - sMapModelList: [], + sMapModelList: [ + { + id: "swmx", + name: "涓夌淮妯″瀷", + active: false, + type: "san", + src: require("@/assets/img/layer/swmx.png"), + }, + ], areaTypeList: [ { id: "瑙勫垝鑼冨洿", @@ -208,7 +217,7 @@ ], zhuantiList: ZTTitem, //curMapModelIndex: 1, - curEMapModelIndex: 1, + curEMapModelIndex: 0, curSMapModelIndex: -1, curAreaTypeIndex: -1, curYjIndex: -1, @@ -241,32 +250,32 @@ window.Viewer.scene.screenSpaceCameraController.maximumZoomDistance = max; window.Viewer.scene.screenSpaceCameraController.enableTilt = enableTilt; }, - handleMapClick(result, index) { - const val = layers.filter((res) => { - if (res.name == result.name) { - return res; - } - }); - const children = val[0].children; - if (this.curMapModelIndex == index) { - clearLayerByTypeId(result.id); - this.curMapModelIndex = -1; - } else { - this.curMapModelIndex = index; - if (result.type == "er") { - clearLayerByTypeIdArr(["ewdt", "yxdt"]); - } else { - clearLayerByTypeIdArr(["3Dcs", "swmx"]); - } - // clearLayerByTypeIdArr(['ewdt', 'yxdt', '3Dcs', 'swmx']); - _GLOBAL.layers[result.id] = []; - children.forEach((item) => { - let itemLayer = loadLayer(item); - _GLOBAL.layers[result.id].push(itemLayer); - console.log(_GLOBAL.layers[result.id]); - }); - } - }, + // handleMapClick(result, index) { + // const val = layers.filter((res) => { + // if (res.name == result.name) { + // return res; + // } + // }); + // const children = val[0].children; + // if (this.curMapModelIndex == index) { + // clearLayerByTypeId(result.id); + // this.curMapModelIndex = -1; + // } else { + // this.curMapModelIndex = index; + // if (result.type == "er") { + // clearLayerByTypeIdArr(["ewdt", "yxdt"]); + // } else { + // clearLayerByTypeIdArr(["3Dcs", "swmx"]); + // } + // // clearLayerByTypeIdArr(['ewdt', 'yxdt', '3Dcs', 'swmx']); + // _GLOBAL.layers[result.id] = []; + // children.forEach((item) => { + // let itemLayer = loadLayer(item); + // _GLOBAL.layers[result.id].push(itemLayer); + // console.log(_GLOBAL.layers[result.id]); + // }); + // } + // }, // 浜岀淮搴曞浘閫夋嫨 handleEMapClick(result, index) { if (this.curEMapModelIndex == index) return; @@ -275,11 +284,11 @@ switch (result.name) { case "浜岀淮鍦板浘": loadGeoMap(); - loadBaseMap(); - addAnnotationLayer(); + // loadBaseMap(); + // addAnnotationLayer(); addHxLayer(); addYzLayer(); - window.mapapi.getView().setZoom(14); + // window.mapapi.getView().setZoom(14); break; case "褰卞儚鍦板浘": addImageLayer(); @@ -289,17 +298,23 @@ break; } }, + // 璺宠浆鍒颁笁缁� + show3d() { + store.setLayerPanelShow(false); + this.$router.push("/viewer3D"); + }, // 涓夌淮妯″瀷閫夋嫨 handleSMapClick(result, index) { - // 璁剧疆鐩告満 - if (result.name == "3D鍩庡競") { - window.Viewer.scene.globe.maximumScreenSpaceError = 2; - this.changeLayerView(45000, true); - } else if (result.name == "涓夌淮妯″瀷") { - window.Viewer.scene.globe.maximumScreenSpaceError = 2; - this.changeLayerView(80000, true); - } + // // 璁剧疆鐩告満 + // if (result.name == "3D鍩庡競") { + // window.Viewer.scene.globe.maximumScreenSpaceError = 2; + // this.changeLayerView(45000, true); + // } else if (result.name == "涓夌淮妯″瀷") { + // window.Viewer.scene.globe.maximumScreenSpaceError = 2; + // this.changeLayerView(80000, true); + // } // 鍒囨崲鍥惧眰 + this.show3d(); const val = layers.filter((res) => { if (res.name == result.name) { return res; @@ -310,16 +325,16 @@ // clearLayerByTypeId(result.id); // this.curSMapModelIndex = -1; } else { - this.curEMapModelIndex = -1; - this.curSMapModelIndex = index; - clearLayerByTypeIdArr(["ewdt", "yxdt"]); - clearLayerByTypeIdArr(["3Dcs", "swmx"]); - _GLOBAL.layers[result.id] = []; - children.forEach((item) => { - let itemLayer = loadLayer(item); - _GLOBAL.layers[result.id].push(itemLayer); - console.log(_GLOBAL.layers[result.id]); - }); + // this.curEMapModelIndex = -1; + // this.curSMapModelIndex = index; + // clearLayerByTypeIdArr(["ewdt", "yxdt"]); + // clearLayerByTypeIdArr(["3Dcs", "swmx"]); + // _GLOBAL.layers[result.id] = []; + // children.forEach((item) => { + // let itemLayer = loadLayer(item); + // _GLOBAL.layers[result.id].push(itemLayer); + // console.log(_GLOBAL.layers[result.id]); + // }); } }, // 涓撻鍥鹃�夋嫨 @@ -416,6 +431,7 @@ window.mapapi.removeLayer(window.tdglLine); window.tdglLine = null; } + if (window.tdgllayer) { store.setSliderShow(false); window.mapapi.removeLayer(window.tdgllayer); @@ -442,7 +458,7 @@ url: "https://skyzt.bda.gov.cn/gisserver/wmsserver/chengshiguihua_dikuaibianhao", params: { VERSION: "1.1.1", - SRS: "EPSG:4326", + SRS: "EPSG:3857", FORMAT: "image/png", TILED: true, LAYERS: "", @@ -483,6 +499,7 @@ this.curFuncIndex = -1; store.setTdglFlag(false); store.setSliderShow(false); + window.mapapi.removeLayer(window.tdgllayer); store.setHistoryShow(true); break; } @@ -551,7 +568,7 @@ align-items: center; /* padding: 0.1rem; */ background: #ffffff; - z-index: 1000; + /* z-index: 1000; */ /* padding-left: 0.25rem; */ border-radius: 15px 15px 0px 0px; } @@ -575,8 +592,7 @@ line-height: 15px; margin-bottom: 18px; } -.container { - width: 100%; +.mapMode .container { display: flex; align-items: center; text-align: center; @@ -588,27 +604,27 @@ font-family: "寰蒋闆呴粦"; font-weight: 400; cursor: pointer; + text-align: center; } .mapMode .layerItem { - width: 91px; + width: 0.8rem; margin-right: 24px; } .mapMode img { display: block; - width: 91px; + width: 100%; border-radius: 11px; border: 1px dashed #127dff; - /* height: 40px; */ margin-bottom: 11px; } span { font-family: "寰蒋闆呴粦"; - font-weight: 500; - font-size: 15px; - color: #212121; + font-size: 0.12rem; + color: #6e6969; line-height: 12px; } -.active { +.mapMode .active, +.areaType .active { color: #127dff; border: 2px solid #127dff; border-radius: 10px; @@ -621,17 +637,31 @@ width: 100%; margin-top: 30px; } + .areaType .ZTtitle { margin-left: 28px; margin-bottom: 3px; } -.areaType .container{ - padding: 0 18px 22px; - justify-content: space-between; +.areaType .container { + margin-top: 18px; + padding: 0 4%; + display: grid; + justify-items: center; + grid-template-columns: repeat(4, 1fr); + overflow: hidden; } +.areaType .layerItem { + margin-bottom: 15px; +} + .areaType img { + margin: 0 auto; + /* background-color: green; */ display: block; - width: 84px; + width: 0.5rem; + border-radius: 11px; + box-shadow: 0 0 5px 5px rgb(196 222 236 / 30%); + margin-bottom: 11px; } .more { -- Gitblit v1.9.3