You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
95 lines
1.8 KiB
95 lines
1.8 KiB
<template>
|
|
<view class="content">
|
|
<map style="width: 100%; height: 90vh;"
|
|
:layer-style='5'
|
|
:style="{height:mapheight}"
|
|
:show-location='true'
|
|
:latitude="latitude"
|
|
:longitude="longitude"
|
|
:markers="markers"
|
|
:scale="scale"
|
|
@markertap="markertap"
|
|
@callouttap='callouttap'>
|
|
|
|
<!-- subkey="66c5a2ad2849" -->
|
|
</map>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import position from '@/utils/position.js'
|
|
export default {
|
|
data() {
|
|
return {
|
|
latitude: 23.106574, //纬度
|
|
longitude: 113.324587, //经度
|
|
scale: 10, //缩放级别
|
|
bottomData: false,
|
|
mapCtx: null,
|
|
markers:[
|
|
{ //标记点A 的信息
|
|
iconPath: "/static/logo.png", //图标
|
|
id: 0,
|
|
width: 20, //图标icon 宽度
|
|
height: 28 ,//图标icon 高度
|
|
latitude: 26.1272,
|
|
longitude: 113.11659
|
|
}
|
|
]
|
|
}
|
|
},
|
|
onLoad() {
|
|
position.getLocation(res => {
|
|
console.log(res);
|
|
this.latitude = res.latitude
|
|
this.longitude = res.longitude
|
|
})
|
|
},
|
|
computed: {
|
|
mapheight() {
|
|
let data = ''
|
|
if (this.bottomData) {
|
|
if (this.upTop) {
|
|
data = '50px'
|
|
} else {
|
|
data = '200px'
|
|
}
|
|
} else {
|
|
data = '90vh'
|
|
}
|
|
return data
|
|
},
|
|
coverbottom() {
|
|
let data = ''
|
|
if (this.bottomData) {
|
|
data = '20rpx'
|
|
} else {
|
|
data = '100rpx'
|
|
}
|
|
return data
|
|
}
|
|
},
|
|
onShow() {
|
|
this.mapCtx = wx.createMapContext('map');
|
|
this.mapCtx && this.mapCtx.addCustomLayer({
|
|
layerId: '66c5a2ad2849',
|
|
success: (res) => {
|
|
console.log('success', res);
|
|
},
|
|
fail: (e) => {
|
|
console.log('fail', e);
|
|
},
|
|
});
|
|
},
|
|
methods: {
|
|
//地图点击事件
|
|
markertap(e) {
|
|
console.log("===你点击了标记点===", e)
|
|
},
|
|
//地图点击事件
|
|
callouttap(e) {
|
|
console.log('地图点击事件', e)
|
|
}
|
|
}
|
|
}
|
|
</script>
|