谷歌地图USGSO在同一级别标记上覆盖点击事件多响应

Google Map USGSOverlay clickevent multi response on same level markers

本文关键字:覆盖 响应 事件 USGSO 一级 谷歌地图      更新时间:2023-11-27

我使用谷歌地图V3创建了20个标记,点击一个标记,标记就会显示它的信息窗口(该标记、信息窗口都是由USGSOverlay创建的)。

现在,我有一个错误,例如:

我点击了标记A,显示了信息窗口B,在这里我会点击信息窗口B转到另一个页面,但现在,标记C(位于信息窗口B下)也得到了点击环境,并显示了它的信息窗口D。

为什么?我试图阻止传播,但没有!

function makeInfoWindow(item){
    var marker= new USGSOverlay(getLargeView(item),item.getLatLng(),{x:-56,y:-118},'infobox',item.id);
    mGmap.addOverlay('infobox',marker);
    marker.bind("click",function(event){
        event.cancelBubble = true;
        if (event.stopPropagation) {
            event.stopPropagation();
        }
        console.log("InfoWindow click ");
    });
    return marker;
}
USGSOverlay.prototype.bind = function (eventname, callback) {
    this.clickListener=callback;
    google.maps.event.addDomListener(this.htmlObj_, eventname, this.clickListener);
}

我认为标记和infowindos在同一级别,所以他们得到了相同的点击事件,我为此花了很多时间,有人帮我吗?

//marker
function makePointMarker(item){
    var marker = new google.maps.Marker({
        position: item.getLatLng(),
        map: mGmap._map,
        draggable: false,
        icon: getPointIcon(item)
    });
    //infowindow
    if(item.infoWindow == null){
        item.infoWindow=makeInfoWindow(item);
        item.infoWindow.hide();
    }
    // register marker clickevent
    google.maps.event.addDomListener(marker, 'click', function() {
        //event.stopPropagation();
        // event.cancelBubble = true;
        if(mSelectedItem!=null){
            if(mSelectedItem.id==item.id){
                if(mSelectedItem.infoWindow.isShow()){
                    mSelectedItem.infoWindow.hide();
                    console.log("hide");
                }else{
                    mSelectedItem.infoWindow.show();
                    console.log("show");
                }
                refreshMap();
                window.gsMapNative.onMarkerClicked(mSelectedItem.infoWindow.isShow(),item.id,item.name,item.isMainPoi,item.poiType,item.mapType,item.inChina);
                return;
            }else{ 
                mSelectedItem.infoWindow.hide();
                mSelectedItem.infoWindow=null;
                mSelectedItem=null;
            }
        }
        console.log("create new !");
        mSelectedItem=item;
        mSelectedItem.infoWindow=makeInfoWindow(item);
        mSelectedItem.infoWindow.show();
        refreshMap();
        window.gsMapNative.onMarkerClicked(mSelectedItem.infoWindow.isShow(),item.id,item.name,item.isMainPoi,item.poiType,item.mapType,item.inChina);
        return true;
    });
    return marker;
}

我以前遇到过这个问题,并使用markerOption infoWindowIndex解决了这个问题。因此,将所有20个信息窗口放在一个全局数组列表中,对于每个标记,您可以通过指定这样的索引来指定信息窗口,

var marker = new google.maps.Marker({
        position: item.getLatLng(),
        map: mGmap._map,
        draggable: false,
        icon: getPointIcon(item),
        infoWindowIndex : index    //* <- make sure this index points to the correct info window
    });

在listner函数中,您可以使用标记对象中的this.infoWindowIndex来索引到infoWindo对象