markerList是一个外部的数组,包含若干对象,我想在map.on方法中使用外部定义的数组markerList,请给我完整的代码演示
时间: 2024-02-25 13:53:07 浏览: 59
element vue Array数组和Map对象的添加与删除操作
5星 · 资源好评率100%
好的,可以使用以下代码来在 `map.on` 方法中使用外部定义的数组 `markerList`:
```javascript
// 定义一个空的数组 markerList
const markerList = []
// 创建地图对象
const map = new AMap.Map('map-container', {
zoom: 10,
center: [116.39, 39.9]
})
// 在地图上添加标记,并将标记对象加入 markerList 数组中
const marker1 = new AMap.Marker({
position: [116.39, 39.9]
})
markerList.push(marker1)
const marker2 = new AMap.Marker({
position: [116.42, 39.9]
})
markerList.push(marker2)
// 在map.on方法中使用外部定义的数组 markerList
map.on('click', function() {
// 遍历 markerList 数组,并将每个标记对象的位置设置为地图的中心点
markerList.forEach(function(marker) {
const center = map.getCenter()
marker.setPosition(center)
})
})
```
在这个例子中,我们首先定义了一个空的数组 `markerList`,然后在地图上添加了两个标记对象,并将它们加入了 `markerList` 数组中。最后,在 `map.on` 方法中,我们遍历了 `markerList` 数组,并将每个标记对象的位置设置为地图的中心点。
值得注意的是,在回调函数中使用 `markerList` 数组时,我们使用了普通的函数表达式,而不是箭头函数。这是因为普通的函数表达式中的 `this` 关键字会指向当前的上下文对象(也就是地图对象 `map`),而箭头函数中的 `this` 关键字则会指向外部的上下文对象,这可能会导致一些问题。
阅读全文