2014-04-25 67 views
0

我已經看到與此相關的其他問題,我看到的解決方案似乎都沒有幫助。也許我只是忽略了一些東西。谷歌地圖infowindow只顯示第一個infowindow,即使其他標記

任何幫助,將不勝感激。

我有一張地圖,我正在加載1000個標記。當用戶在標記上執行鼠標懸停時,我需要infowindow在標記所在的位置顯示該標記。

我遇到的問題是,同一個infowindow出現在同一個標​​記上,不管哪個標記我鼠標懸停。

我在下面提供了一張屏幕截圖,其中顯示了帶有標記和infowindow的地圖。所以,無論我將鼠標懸停在哪個標記上,都會顯示相同的infowindow。

這是代碼(gm爲實例化的對象google.maps):

for (var i = 0; i < opts.LocationsData.length; i ++) { 
    var datum = opts.LocationsData[i]; 
    var icon = new gm.MarkerImage(datum.map_pin_loc + datum.map_marker + '.svg',null, null, null, new google.maps.Size(31,51)); 
    var loc = new gm.LatLng(datum.latitude, datum.longitude); 
    var zi = 500; 
    if(i>9) 
    { 
     datum.map_pin_icon = datum.map_pin_loc + 'dot1.svg'; 
     icon = new gm.MarkerImage(datum.map_pin_icon,null, null, null, new google.maps.Size(8,8)); 
     zi=450; 
    } 

    var marker = new gm.Marker({ 
     position: loc, 
     /** title: datum.title != '' ? datum.title : datum.description, **/ 
     icon: icon, 
     zIndex: zi, 
     map: map 
    }); 
    marker.type = 'point'; 
    marker.post_id = datum.pin_id; 
    marker.scrollAndAnimate = true; 

    /** (these are used elsewhere in my code for marker management and other purposes) **/ 
    markers.push(marker); 
    markersLatLngObjs.push(loc); 

    var infowindow = new gm.InfoWindow({ 
     content: '<strong>' + (datum.title != '' ? datum.title : datum.description) + '</strong>' 
    }); 
    gm.event.addListener(marker, 'mouseover', function() { 
     infowindow.open(map,marker); 
    }); 
} 

enter image description here

+0

[Google Maps JS API v3 - 簡單多標記示例]的可能重複(http://stackoverflow.com/questions/3059044/google-maps-js-api-v3-simple-multiple-marker-example) – geocodezip

+0

謝謝。但爲什麼-1?我做了搜索,沒有遇到這個問題。我也研究過這一點,並嘗試了多種解決方案無濟於事。所以努力-1?來吧。 – kambythet

回答

1

的PB是鼠標懸停事件處理程序是一個封閉引用其在上下文中唯一的變量的調用函數。更好地將這部分移到循環外部以便看清楚。

例如,你可以定義一個函數,例如:

marker.placeIndex = i;

function showInfo() { // called in the context of a marker var datum = opts.LocationsData[this.placeIndex]; var infowindow = new gm.InfoWindow({ content: '<strong>' + (datum.title != '' ? datum.title : datum.description) + '</strong>' }); infowindow.open(map, this); }

只是你的循環之前,然後在你的循環屬性placeIndex(例如)標籤標記

並最終綁定處理程序:

gm.event.addListener(marker, 'mouseover', showInfo);

編輯:哎呀,我的壞,忘了其他的參考資料,相同的pb。你可以在處理程序中用'this'替換標記。我更新了代碼。