2012-09-08 62 views
1

我使用gmap進行地理定位,即在特定位置上的谷歌地圖上設置標記。 現在我想實現的是設置標記,只要用戶點擊其中一個標記,信息窗口就會打開並顯示特定的文本。每個標記都有自己的文本。javascript - 將文字添加到gmap標記

現在的問題是我無法確定用戶點擊了哪個標記,因此無法設置正確的文本。

這裏有一個代碼片段:

//**Global variables**/ 
    var thingsOfInterest = new Array(new Array(), new Array(),new Array()); 
    var map = null; 
    //End Global variables 

    //init google map 

function initGoogleMaps(){ 
    map = new google.maps.Map(document.getElementById("map_canvas")); 
    var centerMap = new google.maps.LatLng(48.337881,14.320323); 
    $('#map_canvas').gmap({'zoom':7,'center': centerMap}); 
    $('#map_canvas').gmap('option', 'zoom', 10); 

    //This is not working on my ios-simulator, no idea why. Anyway.... 
    forge.geolocation.getCurrentPosition(function(position) { 
      alert("Your current position is: "+position); 
     }, function(error) { 
    }); 
} 
/*End init map*/ 

/*Set the markers on the map*/ 
function setMarkers() { 
    /* thingsOf Interest contains: 
    * thingsOfInterest[i][0] -> the text that the marker should hold 
    * thingsOfInterest[i][1] -> the latitude 
    * thingsOfInterest[i][2] -> the longitude 
    */ 

    for (var i = 0; i < thingsOfInterest.length; i++) { //Iterate through all things 
     var item = thingsOfInterest[i]; //get thing out of array 
     var itemLatLng = new google.maps.LatLng(item[1], item[2]); 

     $('#map_canvas').gmap('addMarker', {'position': new google.maps.LatLng(item[1],item[2]) }).click(function(e) { 
        $('#map_canvas').gmap('openInfoWindow', {'content': 'dummyContent'}, this); ///////SET REAL CONTENT HERE 
     }); 
    } 

} 

現在這個工程的所有偉大的,但我想是獲得標記的用戶點擊的功能() - 事件處理程序。如果我能得到具體的標記,我可以設置它的文字。

我希望這已經夠清楚了。

任何幫助非常感謝。

感謝,

enne

回答

1

假設與虛擬文本正在你的代碼,你可以通過你的文字馬上..

$('#map_canvas').gmap('addMarker', {'position': new google.maps.LatLng(item[1],item[2])}) 
    .click(function(e) { 
     $('#map_canvas').gmap('openInfoWindow', {'content': item[0]}, this); 
    }); 

或另一種作法是:

function setMarkers() { 

    for (var i = 0; i < thingsOfInterest.length; i++) { 

     var item = thingsOfInterest[i]; 
     var itemLatLng = new google.maps.LatLng(item[1], item[2]); 

     var marker = new google.maps.Marker({ position: itemLatLng, map: map }); 

     google.maps.event.addListener(marker, 'click', function() { 
      var infowindow = new google.maps.InfoWindow({ content: item[0] }); 
      infowindow.open(map, marker); 
     }); 
    } 
} 
+0

感謝Michal Klouda的幫助。那麼,第一種方法不適用於imho,因爲每個infowindow中總會有項[0]的文本。第二種方法看起來不錯,如果用項目[i]替換項目[0]。不幸的是,它並沒有在我的iOS iPhone模擬器中添加一個標記,我不知道爲什麼。 – enne87

+0

@ enne87你試過嗎?使用相同的邏輯,所有的標記將處於相同的位置。秒解決方案是我如何在我的項目中做同樣的事情,並知道它的工作。而物品[i]的東西沒有多大意義,因爲item已經從迭代數組中取出。 –

+0

對不起!我昨天有點厭倦了所有的編碼,所以我覺得不夠。你是絕對正確的,當然,項目[i]將是完全廢話。但它仍然需要東西的最後一個條目的文字,這意味着當我嘗試你的第一個和第二個方法時,item [0]總是相同的... – enne87