<template>
<view>
<map :scale='18' id="myMap" style="width: 100%;" :style="{
height: mapHeight + 'px'}" :markers="markers" :longitude="longitude"
:latitude="latitude" :circles="circles"></map>
</view>
</template>
<script>
export default {
data() {
return {
// 在data中初始化的中心位置
latitude: 39.9,
longitude: 116.4,
//data中定义
circles: [], //圆
markers: [], //标记点
}
},
onLoad() {
const _this = this;
uni.getSystemInfo({
success: (res) => {
_this.mapHeight = res.screenHeight - res.statusBarHeight
_this.mapHeight = _this.mapHeight
console.log(res)
},
})
},
methods: {
getLocationInfo() {
var that = this
uni.getLocation({
type: 'wgs84',
success(res) {
console.log(res, "当前位置");
that.latitude = res.latitude //当前纬度
that.longitude = res.longitude //当前经度
}
})
},
// 获取地理位置
getLocationInfo() {
var that = this
uni.getLocation({
type: 'wgs84',
success(res) {
console.log(res, "当前位置");
that.latitude = res.latitude
that.longitude = res.longitude
//标记点
that.markers = [{
id: 1,
latitude: res.latitude,
longitude: res.longitude,
iconPath: '../../../static/img/pos.png',
}]
that.circles = [{
//在地图上显示圆
latitude: res.latitude,
longitude: res.longitude,
fillColor: "#D9E6EF", //填充颜色
color: "#A7B6CB", //描边的颜色
radius: 50, //半径
strokeWidth: 2 //描边的宽度
}]
}
});
},
}
}
</script>
<style>
</style>
定位地图
猜你喜欢
转载自blog.csdn.net/QZ9420/article/details/113773744
今日推荐
周排行