H5W3
当前位置:H5W3 > 其他技术问题 > 正文

高德地图设置多个圆点,只有最后一个生效circleMarker.setOptions

<script>

  var map = new AMap.Map('map', {
// viewMode: '3D',
zoom: 4,
center: [ 108, 34]
})
for(var i=0;i<capitals.length;i+=1){
var center = capitals[i].center;
var circleMarker = new AMap.CircleMarker({
center:center,
radius:10+Math.random()*10,
strokeColor:'white',
strokeWeight:2,
strokeOpacity:0.5,
fillColor:'rgba(0,0,255,1)',
fillOpacity:0.5,
zIndex:10,
bubble:true,
cursor:'pointer',
clickable: true
})
circleMarker.setMap(map)
}
// 接下来在下面重新修改两个指定的经纬度的点的颜色
circleMarker.setOptions({
center:[116.740368,33.109056],
radius:10+Math.random()*10,
strokeColor:'white',
strokeWeight:2,
strokeOpacity:0.5,
fillColor:'red',
fillOpacity:0.5,
zIndex:10,
bubble:true,
cursor:'pointer',
clickable: true
})
// 只有下面蓝色生效  ,上面的不生效
circleMarker.setOptions({
center:[116.740368,40.109056],
radius:10+Math.random()*10,
strokeColor:'white',
strokeWeight:2,
strokeOpacity:0.5,
fillColor:'blue',
fillOpacity:0.5,
zIndex:10,
bubble:true,
cursor:'pointer',
clickable: true
})
// 这是为什么 ,有没有什么办法可以让多点重新设置都生效
</script>

回答

首先你要知道circleMarker是个啥,有一辆车,A开完了B开,B开完了C开,以此类推,最后开车的是Z,那么最后开车的就是Z,就像你的代码,最后circleMarker指向的就是最后一个点,你下面两个setOptions都是针对最后一个点在做设置。

那么要如何才能获取到其他的点呢,你可以把这些点都存到数组中,然后根据下标去获取,也可以把这些点存到对象中,对象的key可以为点信息,比如经纬度等,然后取的时候根据key就可以获取到对应的点。

本文地址:H5W3 » 高德地图设置多个圆点,只有最后一个生效circleMarker.setOptions

评论 0

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址