uniapp中高德地图给marker添加点击事件
时间: 2023-09-29 16:08:29 浏览: 206
在uniapp中使用高德地图,可以通过以下步骤给marker添加点击事件:
1. 在template中定义地图组件,例如:
```
<template>
<view class="map-container">
<map :longitude="longitude" :latitude="latitude" :markers="markers" @markertap="onMarkerTap"></map>
</view>
</template>
```
2. 在script中定义地图组件的data和methods,例如:
```
<script>
export default {
data() {
return {
longitude: 116.397428,
latitude: 39.90923,
markers: [{
id: 1,
latitude: 39.90923,
longitude: 116.397428,
title: 'Marker 1',
iconPath: '/static/images/marker.png'
}, {
id: 2,
latitude: 39.91923,
longitude: 116.407428,
title: 'Marker 2',
iconPath: '/static/images/marker.png'
}]
}
},
methods: {
onMarkerTap(e) {
console.log('Marker ' + e.markerId + ' was tapped')
}
}
}
</script>
```
3. 在markers数组中定义每个marker的id、经纬度、标题、图标等属性;同时,在map组件中通过@markertap监听marker的点击事件,并调用onMarkerTap方法处理事件。
4. 在onMarkerTap方法中可以获取到被点击marker的id,进行相应的处理。
阅读全文
相关推荐


















