Question

这些是我的标记坐标。

var markers = [
    {
       "title": 'Burrel',
        "lat": '41.6065764',
        "lng": '20.0130826',
    },
    {
        "title": 'Grabian',
        "lat": '40.9501',
        "lng": '19.583533'
    },
    {
        "title": 'Spac',
        "lat": '41.899017',
        "lng": '20.0456071'
    }
];

以下是我的代码，它遍历所有并在地图上创建标记以及添加点击事件监听器

 for (var i = 0; i < markers.length; i++) {
      var data = markers[i];
      var myLatlng = new google.maps.LatLng(data.lat, data.lng);
      var marker = new google.maps.Marker({
            position: myLatlng,
            map: map,
            title: data.title,
            icon: 'images/marker.png'
      });

  (function (marker, data) {
      google.maps.event.addListener(marker, "click", function (e) {
                var x = document.getElementsByClassName("displayblock")[0];
                x.style.zIndex=0;
                x.className = "w-clearfix slide";
                var d = document.getElementById(this.title);
                d.className = "w-clearfix slide displayblock";
                d.style.zIndex=1;   
        });
                })(marker, data);
    }

在循环中生成的原始标记具有图像标记＆＃39; images / marker.png＆＃39;我想用＆＃39; images / marker2.png＆＃39;替换它。点击并让它们切换..在正确的方向轻推将非常感激..

Answer 1

尝试更改点击处理程序中的标记图标。您只需跟踪当前选定的标记并重置其他标记即可。

marker.setIcon( otherIcon );

https://developers.google.com/maps/documentation/javascript/reference#Marker

Answer 2

setIcon将用于切换标记，但复杂性在于添加事件侦听器以及以干净的方式清除未选择的图标。在循环中，您可以将事件侦听器直接添加到标记：

marker.addListener('click', function() {
  this.setIcon(selectedSymbol);
});

你可以通过添加类似@ tkdave建议的数组来管理所有标记：

var markers = [];
function clearSelectedMarker() {
  markers.forEach(function(marker) {
    marker.setIcon(image);
  });
}
for (var i = 0; i < beaches.length; i++) {
  var beach = beaches[i];
  var marker = new google.maps.Marker({
    position: {lat: beach[1], lng: beach[2]},
    map: map,
    icon: image,
    shape: shape,
    title: beach[0],
    zIndex: beach[3]
  });
  marker.addListener('click', function() {
    clearSelectedMarker();
    this.setIcon(selectedSymbol);
  });
  markers.push(marker);
}

对我而言，这也更具可读性。

https://jsfiddle.net/fpgya6Lq/1/

是否可以在单击特定图标时更改地图标记图标，然后在单击其他图标时切换等等？

2 个答案: