如何判断当前是否选择了 Google 地图标记？

Question

我在 Google Maps V3 上有一个足够简单的地图。

我在鼠标悬停侦听器事件上更改图标图像，在鼠标移出时将其更改回来，非常简单。

单击标记时，我再次更改图标，但是，我想在选择标记时保留该图标。当我将鼠标移开时，标记图标再次发生变化，因为我告诉它在鼠标移出侦听器事件中这样做。

我需要从 mouseout 侦听器事件中排除所选标记，但我不知道如何找到当前选择的标记。有任何想法吗？

这是我的代码

            google.maps.event.addListener(marker, 'mouseover', function () {
                this.setIcon("images/star-3-white.png");

            });
            google.maps.event.addListener(marker, 'mouseout', function () {
                    //  this overwrites the image again, 
                    //  need to exclude the current one here
                    this.setIcon("images/star-3.png");
            });

            google.maps.event.addListener(marker, 'click', function () {
                this.setIcon("images/star-3-white.png");
                infowindow.setContent(this.html);
                infowindow.open(map, this);
            });

Answer 1

有点啰嗦，但我只是添加了一个变量来存储当前标记标题，我知道它是唯一的。然后我检查一下是否是我选择的那个。另外，我确保重置所有标记，这样它就不会保持与所选标记相同的颜色：

    var clickedMarkerTitle = null;
    function addMarker(latLng, _title, contentString) {
        marker = new google.maps.Marker({
            map: map,
            position: latLng,
            icon: "images/star-3.png",
            title: _title,
            html: contentString
        });

        google.maps.event.addListener(marker, 'mouseover', function () {
            this.setIcon("images/star-3-white.png");

        });
        google.maps.event.addListener(marker, 'mouseout', function () {
            //this.setIcon("images/star-3.png");
            testIcon(this);
        });

        google.maps.event.addListener(marker, 'click', function () {
            resetMarkerIcons();
            saveIconState(this);
            this.setIcon("images/star-3-white.png");
            infowindow.setContent(this.html);
            infowindow.open(map, this);

        });

        markersArray.push(marker);

    }
    function resetMarkerIcons() {
        //  reset all the icons back to normal except the one you clicked
        for (var i = 0; i < markersArray.length; i++) {
            markersArray[i].setIcon("images/star-3.png");

        }

    }
    function saveIconState(marker) {
        clickedMarkerTitle = marker.title;
    }
    function testIcon(marker) {
        $('#test').html('<span>' + marker.title + '</span>');

        if (clickedMarkerTitle != null) {
            $('#test').html('<span>' + marker.title + ' and its not null</span>');
            if (marker.title != clickedMarkerTitle) {
                $('#test').html('<span>' + marker.title + ' and ' + clickedMarkerTitle + '</span>');
                marker.setIcon("images/star-3.png");
            }
        }
        else {
            marker.setIcon("images/star-3.png");
        }
    }