nicht definierte variable in toggle Funktion (GMaps API v3)

[Iago]

Hallo,
ich versuche mich an meinen ersten Scirpten mit der google API. Hier habe ich ein Tutorial,
welches marker (auf der Karte) ausgeben soll, welche man dann an und ausschalten kann
(theoretisch ganz einfach)
Jetzt lade ich zuerst die API, dann initialisiere ich die Karte und gebe die Marker aus (bisher also alles o.k.!)

Jetzt habe ich eine Funktion, die beim klicken auf einen einen Button das an- und ausschalten bewirken soll. hier bekomme ich stets die Fehlermeldung in der for-Schleif innerhalb displayMarkers : markers is not defined

Eingetlich müsste markers doch sichbar sein?? Wo könnte der Fehler liegen. Viele Dank!

Hier zunächst die Buttons:

<input type="button" value="Show Group 1" onclick="displayMarkers(1);"/>
       <input type="button" value="Show Group 2" onclick="displayMarkers(2);"/>

Hier der JS-Code. initialialize() wird in body-tag aufgerufen:

 function initialize(){

      var deutschland = new google.maps.LatLng(51,9);

      var mapOptions = { zoom: 6,
                         center: deutschland,
                         streetViewControl: true,
                         scaleControl: true,
                         mapTypeControl: true,
                         mapTypeId: google.maps.MapTypeId.ROADMAP };


   var map = new google.maps.Map(document.getElementById("map-container"),mapOptions);


   var beaches = [
     ['Bondi Beach', 51, 9, 1],
     ['Coogee Beach', 52, 9, 1],
     ['Cronulla Beach', 51, 8, 2],
     ['Manly Beach',51.5, 9, 2],
     ['Maroubra Beach',52.5, 10, 2]
   ];

   var markers = [];
   var i, newMarker;

   for (i = 0; i < beaches.length; i++) {
     newMarker = new google.maps.Marker({
       position: new google.maps.LatLng(beaches[i][1], beaches[i][2]),
       map: map,
       title: beaches[i][0]
     });

     newMarker.category = beaches[i][3];
     newMarker.setVisible(true);

     markers.push(newMarker);
   }

   }
    function displayMarkers(category) {
      var i;

     for (i = 0; i < markers.length; i++) {
       if (markers[i].category == category) {
         if (markers[i].getVisible()) {
              markers[i].setVisible(false); }

        else { markers[i].setVisible(true); } } }

   }

 

[s4ty]

Dein Problem ist das die Variable markers nur innherhalb von initialize bekannt ist.

Entweder machst du sie Global damit auch displayMarkers sie kennt oder du übergibst sie als Parameter.

 

[Iago]

O.k. und um sie global zu machen lass ich dann das var weg!! Richtig??

 

[s4ty]

Um sie Global zu machen musst du sie außerhalb der Funktion deklarieren, du kannst auch das var weglassen...finde ich persönlich aber nicht schön.

 

[tsseh]

besser ist es, du definierst displayMarkers innerhalb von initialize und weist auch dort die eventhandler zu

 

[Nisbo]

Das Thema ist zwar schon älter welches ich über die Suchfunktion gefunden habe aber es passt ganz gut da ich die Selbe Funktion nutze um Marker ein und aus zu blenden, funktioniert auch.

Mein Problem ist halt das ja dichte Marker zusammen gefasst werden und in dem Kreis dann die Anzahl der Marker steht.

Blende ich jetzt Marker einer bestimmten Kategorie aus dann bleiben die Kreise mit den Zahlen unverändert, die Marker dahinter wenn man rein zoomt sind aber wie gewünscht verschwunden.

Hat jemand eine Idee wie man die API dazu bewegt die Kreise (Cluster) neu zu berechnen ?

markerCluster.resetViewport();
tut es jedenfalls nicht, das blendet nur die Cluster (inclusive der Inhalte) aus

markerCluster.redraw();
bewirkt nur ein kurzes blinken auf der Karte

markerCluster.repaint();
bewirkt leider auch nichts