Question

我有一个简单的Google Map，在json对象上添加了一些markers循环。

我正在尝试为所有这些标记添加listener来执行简单的操作（更改旋转）。标记被添加到地图上并且监听器被调用，但是当我单击其中一个标记时，操作始终在最新添加的标记上执行。

我如何获得射击标记？我认为方法是使用监听器函数的evt参数，但我不知道如何。

我用firebug观察了evt参数，但没有结果。

以下是代码：

for(var i in _points){

    _markers[i] = new google.maps.Marker({

        position: {
            lat: parseFloat(_points[i]._google_lat),
            lng: parseFloat(_points[i]._google_lon)
        },

        icon: {
            path: google.maps.SymbolPath.FORWARD_CLOSED_ARROW,
            scale: 3,
            rotation: parseInt(_points[i]._rotation)
        },

        map: _map,

        title: _points[i]._obj_id
    });

    google.maps.event.addListener(_markers[i], 'click', function(evt){

        //console.log(evt);

        r = _markers[i].icon.rotation;

        _markers[i].setIcon({
             path: google.maps.SymbolPath.FORWARD_CLOSED_ARROW,
             scale: 3,
             rotation: r+15
        });
     });

}

Answer 1

点击侦听器功能中的this是对标记的引用：

google.maps.event.addListener(_markers[i], 'click', function(evt){
    //console.log(evt);
    r = this.getIcon().rotation;
    this.setIcon({
         path: google.maps.SymbolPath.FORWARD_CLOSED_ARROW,
         scale: 3,
         rotation: r+15
    });
 });

proof of concept fiddle

代码段

function initMap() {

  // Create a map and center it on Manhattan.
  var _map = new google.maps.Map(document.getElementById('map'), {
    zoom: 10,
    center: {
      lat: 40.771,
      lng: -73.974
    }
  });

  for (var i in _points) {

    _markers[i] = new google.maps.Marker({

      position: {
        lat: parseFloat(_points[i]._google_lat),
        lng: parseFloat(_points[i]._google_lon)
      },
      icon: {
        path: google.maps.SymbolPath.FORWARD_CLOSED_ARROW,
        scale: 3,
        rotation: parseInt(_points[i]._rotation)
      },
      map: _map,
      title: _points[i]._obj_id
    });

    google.maps.event.addListener(_markers[i], 'click', function(evt) {

      r = this.getIcon().rotation;

      this.setIcon({
        path: google.maps.SymbolPath.FORWARD_CLOSED_ARROW,
        scale: 3,
        rotation: r + 15
      });
    });

  }
}

google.maps.event.addDomListener(window, "load", initMap);

var _markers = [];
var _points = [{
  _google_lat: 40.7127837,
  _google_lon: -74.0059413,
  _obj_id: "A",
  _rotation: 0
}, {
  _google_lat: 40.735657,
  _google_lon: -74.1723667,
  _obj_id: "B",
  _rotation: 90
}]

html,
body,
#map {
  height: 100%;
  margin: 0;
  padding: 0;
}

<script src="https://maps.googleapis.com/maps/api/js"></script>
<div id="map"></div>

如何使用带有Google Map API v3的event.addListener获取已触发的标记

1 个答案: