2012-04-09 8 views
0

Ich versuche, mehrere InfoWindows mit dem folgenden Code zu erstellen: EDIT: Um zu verdeutlichen, möchte ich alle Fenster zur gleichen Zeit geöffnet sein.Zuweisen von InfoWindows-Array-Elementen Ergebnisse undefined

for (var i = 0; i < 3; i++) { 
     var markerOptions = {position:point[i], map:map}; 
     var marker = new google.maps.Marker(markerOptions); 
     content = "Hello " + i; 
     infowindow[i] = new google.maps.InfoWindow({content: content}); 
     google.maps.event.addListener(marker, 'mouseover', function() 
     { 
     infowindow[i].open(map,this); 
     }); 
    } 

(full source)

Allerdings bekomme ich die folgenden Fehler in Chrome: Uncaught Typeerror: nicht Methode 'offen' undefinierten nennen.

Wenn ich eine einfache Variable "infowindow" anstelle des Arrays verwende, erscheint das einzelne Infofenster wie erwartet.

Antwort

0

Um das zu erreichen, was ich will, habe ich gelernt, dass a closure is needed:

for (var i = 0; i < 3; i++) 
{ 
    (function(i) { 
    var markerOptions = {position:point[i], map:map, html:'Hello' }; 
    var marker = new google.maps.Marker(markerOptions); 

    google.maps.event.addListener(marker, 'mouseover', function() 
    { 
     infowindow.setContent(this.html); // this is the trick: html attribute on markerOptions :), I used a array here 
     infowindow.open(map,this); 
    }); 
    })(i); 
} 
0

hast du infowindow [i] an die Konsole (Firebug) ausgegeben, um zu sehen, ob es das ist, was du erwartest? Ich denke, im Allgemeinen ist der Weg, dies zu tun, ein Infofenster zu erzeugen und den Inhalt des Infofensters wiederzuverwenden/zu bewegen und zu ändern.

könnte Dieser Link nützlich sein: http: //www.svennerberg.com/2009/09/google-maps-api-3-infowindows/

0

Probe

 var map; 
     var mapOptions = { center: new google.maps.LatLng(0.0, 0.0), zoom: 2, 
     mapTypeId: google.maps.MapTypeId.ROADMAP }; 
     var infowindow = new google.maps.InfoWindow(); 
     function initialize() { 
     map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions); 
     point = []; 
     point[0] = new google.maps.LatLng(0.0,0.0); 
     point[1] = new google.maps.LatLng(0.0,10.0); 
     point[2] = new google.maps.LatLng(0.0,20.0); 


      for (var i = 0; i < 3; i++) { 
       var content = "Hello"+i; 
       addInfowindows(point[i], content)    
      } 
     } 
function addInfowindows(point, content){ 


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


      google.maps.event.addListener(marker, 'mouseover', function() 
      { 
      infowindow.setContent(content); 
      infowindow.open(map,this); 
      }); 


} 
google.maps.event.addDomListener(window, 'load', initialize); 
+0

Diese für alle Fenster in Hello2 Ergebnisse, ich bin auf der Suche nach 1, 2, 3 (Ich füge das zu meiner jsfiddle) –

+0

aktualisiert den Code-Check einmal ... –

+0

Es tut mir wirklich leid, ich habe nicht gesagt, ich möchte alle 3 Infofenster auf einmal geöffnet. Die Frage wurde bearbeitet, aber es ist nicht sofort offensichtlich. Ich möchte dich nicht mehr belästigen, es ist in Ordnung, wenn du nicht mehr weiter machen willst. –

1

Sie arbeiten erstellen nur ein InfoWindow. Früher habe ich an einem Projekt wie folgt aus:

var infowindow = new google.maps.InfoWindow(); 

for (var i = 0; i < 3; i++) 
{ 
    var markerOptions = {position:point[i], map:map, html:'Hello' }; 
    var marker = new google.maps.Marker(markerOptions); 

    google.maps.event.addListener(marker, 'mouseover', function() 
    { 
     infowindow.setContent(this.html); // this is the trick: html attribute on markerOptions :), I used a array here 
     infowindow.open(map,this); 
    }); 
} 
+0

Ja, es funktioniert, jetzt sollte ich gesagt haben, dass ich alle drei Infofenster geöffnet haben möchte (Ich habe die Frage bearbeitet) –