新增点击地点标点,弹出地点信息弹窗功能

master
qubiaobiao 2024-03-04 16:51:18 +08:00
parent eed0aa1d50
commit 746fea5bc6
1 changed files with 2 additions and 14 deletions

View File

@ -49,20 +49,14 @@ const judgmentDown = ref("dispaly:none;");
const adaptive = (imgId) => { const adaptive = (imgId) => {
let newImg; let newImg;
let describesBox;
let brieflyBox;
setTimeout(() => { setTimeout(() => {
newImg = document.getElementById(imgId); newImg = document.getElementById(imgId);
describesBox = document.getElementById("describesBox");
brieflyBox = document.getElementById("brieflyBox");
}, 5); }, 5);
setTimeout(() => { setTimeout(() => {
let newWidth = window.getComputedStyle(newImg, null)["width"]; let newWidth = window.getComputedStyle(newImg, null)["width"];
let newMargin = window.getComputedStyle(newImg, null).marginLeft; let newMargin = window.getComputedStyle(newImg, null).marginLeft;
describesBox.style.width = newWidth; describesShow.value = `width:${newWidth};left:${newMargin};${judgmentDown.value}`;
describesBox.style.left = newMargin; brieflyShow.value = `width:${newWidth};left:${newMargin};${judgmentUp.value}`;
brieflyBox.style.width = newWidth;
brieflyBox.style.left = newMargin;
}, 10); }, 10);
} }
@ -73,24 +67,18 @@ watch(() => LandMarkShow.boxShow, (newValue, oldValue) => {
watch(() => LandMarkShow.information.landImgUrl, (newValue, oldValue) => { watch(() => LandMarkShow.information.landImgUrl, (newValue, oldValue) => {
nowId.value = 1; nowId.value = 1;
nowImg.value = `${LandMarkShow.information.landImgUrl}${nowId.value}.jpg`; nowImg.value = `${LandMarkShow.information.landImgUrl}${nowId.value}.jpg`;
describesShow.value = "display:none;";
brieflyShow.value = "display:block;";
judgmentUp.value = "display:block;"; judgmentUp.value = "display:block;";
judgmentDown.value = "display:none;"; judgmentDown.value = "display:none;";
adaptive(nowId.value); adaptive(nowId.value);
}) })
const up = () => { const up = () => {
describesShow.value = "display:block;";
brieflyShow.value = "display:none;";
judgmentUp.value = "display:none;"; judgmentUp.value = "display:none;";
judgmentDown.value = "display:block;"; judgmentDown.value = "display:block;";
adaptive(nowId.value); adaptive(nowId.value);
} }
const down = () => { const down = () => {
describesShow.value = "display:none;";
brieflyShow.value = "display:block;";
judgmentUp.value = "display:block;"; judgmentUp.value = "display:block;";
judgmentDown.value = "display:none;"; judgmentDown.value = "display:none;";
adaptive(nowId.value); adaptive(nowId.value);