From 023e57a24b3ce05de8a8921387538ec7558f8fd3 Mon Sep 17 00:00:00 2001 From: 少年 <1392120328@qq.com> Date: 星期二, 06 二月 2024 17:27:51 +0800 Subject: [PATCH] 11 --- src/components/viewer2.vue | 63 ++++++++++++++++++++++++++----- 1 files changed, 53 insertions(+), 10 deletions(-) diff --git a/src/components/viewer2.vue b/src/components/viewer2.vue index bd213aa..b8e22f5 100644 --- a/src/components/viewer2.vue +++ b/src/components/viewer2.vue @@ -4,8 +4,9 @@ <div id="openlayerContainer" @click="clicktoclose"></div> <div id="ponitPanel"> + <div id="ponitPanel-close" @click.stop="closehandle"></div> <div class="title">鐐逛綅璇︽儏</div> - <div class="content"> + <div id="ponitPanel-content"> </div> @@ -86,7 +87,7 @@ 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 poplayer from "./poplayer/main2.vue"; import sliderAlpha from "./sideMenu/sliderAlpha/main.vue"; import Axios from "axios"; @@ -184,7 +185,7 @@ resolutions[z] = width / (256 * Math.pow(2, z)); matrixIds[z] = z; } - let wmtsTileGrid = new ol.tilegrid.WMTS({ + let wmtsTileGrid = new ol.tilegrid.WMTS({ origin: origin, resolutions: resolutions, matrixIds: matrixIds, @@ -265,7 +266,7 @@ 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, @@ -418,7 +419,7 @@ width: 100%; height: 100%; background: black; - position: absolute !important; + /* position: absolute !important; */ z-index: 0; } @@ -456,7 +457,7 @@ } #ponitPanel { - display: none; + /* display: none; */ width: 80vw; background-repeat: no-repeat; background-size: 100% 100%; @@ -465,13 +466,55 @@ 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; +} + +.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