新增点击地点标点,弹出地点信息弹窗功能
parent
72ccdcf0a6
commit
0c5cbe6789
|
@ -1,8 +1,8 @@
|
|||
export const isLnglat = lnglat => {
|
||||
const { lng, lat } = lnglat
|
||||
|
||||
if (isNaN(lng) || lng > 180 || lng < -180) return false
|
||||
if (isNaN(lat) || lat > 90 || lat < -90 ) return false
|
||||
if (lng=='' || isNaN(lng) || lng > 180 || lng < -180) return false
|
||||
if (lat=='' || isNaN(lat) || lat > 90 || lat < -90 ) return false
|
||||
|
||||
return true
|
||||
}
|
|
@ -7,13 +7,17 @@
|
|||
<br />
|
||||
<h1 class="describesTitle">{{LandMarkShow.information.landTitle}}</h1>
|
||||
<br />
|
||||
<div class="paragraphBox">
|
||||
<p class="describesParagraph">{{LandMarkShow.information.landDescribes}}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="brieflyBox" class="brieflyBox" :style="brieflyShow">
|
||||
<div class="textBox">
|
||||
<h3 class="brieflyTitle">{{LandMarkShow.information.landTitle}}</h3>
|
||||
<div class="paragraphBox">
|
||||
<p class="brieflyParagraph">{{LandMarkShow.information.landBriefly}}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="share showBtn">
|
||||
|
@ -165,10 +169,15 @@ const close = () => {
|
|||
}
|
||||
.textBox {
|
||||
width: 80%;
|
||||
height: 90%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
margin: auto;
|
||||
}
|
||||
.paragraphBox{
|
||||
height:80%;
|
||||
overflow-x:hidden;
|
||||
overflow-y:auto;
|
||||
}
|
||||
.describesTitle {
|
||||
text-align: center;
|
||||
margin: 0;
|
||||
|
@ -178,25 +187,23 @@ const close = () => {
|
|||
text-align: left;
|
||||
text-indent: 2em;
|
||||
margin: 0;
|
||||
font-weight:bolder;
|
||||
font-size: clamp(0.5rem, 0.489rem + 1.05vw, 1rem);
|
||||
}
|
||||
.brieflyTitle {
|
||||
color: #fff;
|
||||
text-align: left;
|
||||
margin-top: 4%;
|
||||
margin-bottom: 1%;
|
||||
font-size: clamp(0.6rem, 0.489rem + 1.05vw, 1.2rem);
|
||||
}
|
||||
.brieflyParagraph {
|
||||
color: #fff;
|
||||
font-size: clamp(0.4rem, 0.489rem + 1.05vw, 0.8rem);
|
||||
text-align: left;
|
||||
text-indent: 2em;
|
||||
margin-top: 0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
-webkit-line-clamp: 3;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
font-weight:bolder;
|
||||
font-size: clamp(0.4rem, 0.489rem + 1.05vw, 0.8rem);
|
||||
}
|
||||
.boxClose {
|
||||
bottom: 15%;
|
||||
|
|
|
@ -7,6 +7,7 @@ export const useFlytoStore = defineStore({
|
|||
state: () => ({
|
||||
lng: NaN,
|
||||
lat: NaN,
|
||||
change:true,
|
||||
}),
|
||||
getters: {
|
||||
value: (state) => { state.lng, state.lat }
|
||||
|
@ -17,6 +18,7 @@ export const useFlytoStore = defineStore({
|
|||
|
||||
this.lng = flyto.lng
|
||||
this.lat = flyto.lat
|
||||
this.change = !this.change
|
||||
|
||||
return true
|
||||
},
|
||||
|
|
|
@ -7,6 +7,7 @@ export const usePositionStore = defineStore({
|
|||
state: () => ({
|
||||
lng: NaN,
|
||||
lat: NaN,
|
||||
change:true,
|
||||
}),
|
||||
getters: {
|
||||
value: (state) => { state.lng, state.lat }
|
||||
|
@ -17,6 +18,7 @@ export const usePositionStore = defineStore({
|
|||
|
||||
this.lng = position.lng
|
||||
this.lat = position.lat
|
||||
this.change = !this.change
|
||||
|
||||
return true
|
||||
},
|
||||
|
|
Loading…
Reference in New Issue