Google Maps API v3,点击时如何更改标记图标

Question

如何在单击标记时(在单击事件上)更改标记图标,并在单击其他标记时将其返回到正常图标？

Answer 1

无论如何,任何人都希望看到像Kasper所提到的全局变量中跟踪前一个标记的示例,这就是我所做的:

google.maps.event.addListener(marker,'click',function() {

        if (selectedMarker) {
            selectedMarker.setIcon(normalIcon);
        }
        marker.setIcon(selectedIcon);
        selectedMarker = marker;
    });

(将selectedMarker设置为全局变量后)

Answer 2

我没有测试过这段代码,因此可能存在拼写错误或错误,但它应该给你一个想法.

首先,定义一个回调以将所有标记设置为正常图标(以重置以前单击的任何标记)并将当前单击标记的图标设置为所选图标:

var markerCallback = function() {
    for (var i=0; i<arrayOfMarkers.length; i++) {
        arrayOfMarkers[i].setIcon(normalIcon);
    }
    this.setIcon(selectedIcon);
 }

然后,将回调分配给每个标记上的click事件,如下所示:

google.maps.event.addListener(marker, 'click', markerCallback); 

肯定会有一些代码改进.例如,您可能不希望normalIcon,selectedIcon并且arrayOfMarkers成为全局变量,就像上面的代码所假设的那样.如果你有很多标记,你可能想要跟踪之前选择的标记,而不是让for循环重置每一个标记.

但就像我说的那样,这应该会给你一个想法.