Question

我试图实现一种功能，当您单击它时更改标记颜色，当单击它关闭或另一个标记时，它将返回其默认颜色。到目前为止，我已经得到了我的代码，以便在点击时更改颜色，但我似乎无法将封闭的标记恢复为原始颜色。

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

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

      google.maps.event.addListener(infoWindow,'closeclick', function(){
              marker.setIcon(defaultMarker);
              infoWindow.close(defaultMarker)

      })

这是我的小提琴https://jsfiddle.net/Jcook894/88j5ud5h/

Answer 1

您的问题是您在标记和最后一个上设置了两个click事件，将标记颜色设置为蓝色。

您可以点击多次，最后一直是蓝色。

所以，我：

删除了两个标记click事件：marker.addListener('click', function(){})
移动了Google地图.setIcon(highlightedMarker)监听器中的click
添加infowindow.closeclick事件：当infowindow关闭时，会触发事件。
将自定义属性添加到infowindow对象marker对象：infoWindow.marker = marker;

注意：在将此新marker属性设置为infowindow对象之前，请检查它是否为空。如果没有，则实际突出显示标记：设置默认颜色

if (infoWindow.marker) {
  infoWindow.marker.setIcon(defaultMarker);
}

将标记颜色更改为infowindow.closeclick事件中的默认颜色：this.marker.setIcon(defaultMarker);

google.maps.event.addListener(marker,'click', ( function(marker, location){
  return function() {
     console.log("that " + location);
     streetViewService.getPanoramaByLocation(marker.position, streetRadius, getStreetData);

      // Infowindow
        // Marker
      if (infoWindow.marker) {
        infoWindow.marker.setIcon(defaultMarker);
      }
      infoWindow.marker = marker;

      // Open
      infoWindow.open( map, marker);
      infoWindow.setContent("<div>" + marker.title + "</div><div id='pano'></div><div><a href=" + location.url + ">"+ location.url +"</a></div>");

      // Set the marker color
  }
})(marker, locationArray[i]));

google.maps.event.addListener(infoWindow,'closeclick',function(){
  this.marker.setIcon(defaultMarker);
});

Here the JSFiddle

标记动画

1 个答案: