112 lines
2.1 KiB
Vue
112 lines
2.1 KiB
Vue
<template>
|
|
<view class="content">
|
|
<map id="map" :longitude="longitude" :latitude="latitude" scale="14" :controls="controls" :markers="markers"
|
|
show-location style="width: 100%; height: 92vh;">
|
|
</map>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
|
|
controls: [],
|
|
latitude: 23.099994,
|
|
longitude: 113.324520,
|
|
markers: [{
|
|
id: 0,
|
|
latitude: 23.099994,
|
|
longitude: 113.324520,
|
|
width: 50,
|
|
height: 50
|
|
}],
|
|
|
|
}
|
|
},
|
|
onShow() {
|
|
this.getLatLon()
|
|
},
|
|
methods: {
|
|
getLatLon() {
|
|
let _this = this;
|
|
uni.getLocation({
|
|
// 谷歌使用wgs84 其他使用gcj02
|
|
type: 'gcj02', // 使用国测局坐标系
|
|
geocode: true,
|
|
success: function(res) {
|
|
uni.setStorageSync("lon", res.longitude)
|
|
uni.setStorageSync("lat", res.latitude)
|
|
console.log('经度: ' + res.longitude);
|
|
console.log('纬度: ' + res.latitude);
|
|
_this.longitude = res.longitude
|
|
_this.latitude = res.latitude
|
|
|
|
},
|
|
fail: function(err) {
|
|
console.log('获取位置信息失败: ' + err.errMsg);
|
|
uni.setStorageSync("isGetAddress", false)
|
|
}
|
|
});
|
|
},
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.map_cavs {
|
|
position: relative;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
#map {
|
|
z-index: 1;
|
|
}
|
|
|
|
.left_icon {
|
|
height: 35px;
|
|
width: 35px;
|
|
background: #fff;
|
|
color: #41a863;
|
|
background: transparent;
|
|
margin: 15px;
|
|
z-index: 9999999999999999999999;
|
|
margin-top: 44px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
.po-input {
|
|
z-index: 999999;
|
|
width: 90%;
|
|
height: 60px;
|
|
background: #FFFFFF;
|
|
box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.1);
|
|
border-radius: 6px 6px 6px 6px;
|
|
box-sizing: border-box;
|
|
// padding: 15px;
|
|
display: flex;
|
|
align-items: center;
|
|
position: fixed;
|
|
left: 50%;
|
|
top: 44px;
|
|
transform: translate(-50%, -50%);
|
|
}
|
|
|
|
.co-input {
|
|
width: 90%;
|
|
height: 60px;
|
|
background: #FFFFFF;
|
|
box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.1);
|
|
border-radius: 6px 6px 6px 6px;
|
|
box-sizing: border-box;
|
|
// padding: 15px;
|
|
display: flex;
|
|
align-items: center;
|
|
margin: 5px auto;
|
|
margin-top: 44px;
|
|
|
|
}
|
|
</style> |