Ankündigung

Einklappen
Keine Ankündigung bisher.

[Erledigt] Google Maps Boundaries automatisch berechnen

Einklappen

Neue Werbung 2019

Einklappen
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • [Erledigt] Google Maps Boundaries automatisch berechnen

    Hallo zusammen,

    in meinem Script soll eine Karte mit vielen Markern angezeigt werden.
    Die Marker werden aus einer XML-Datei gelesen.

    Ich versuche nun, den Mittelpunkt der Karte und den Zoomfaktor automatisch passend zu den eingetragenen Markern einzurichten.

    Dazu habe ich GLatLngBounds() gefunden, irgendwie funktioniert es aber nicht:

    Code:
    function load() 
            {
            	if (GBrowserIsCompatible()) 
    			{
              		var map = new GMap2(document.getElementById("map"));
    				
               		map.addControl(new GSmallMapControl());
    
    				var bounds = new GLatLngBounds();
    				
    				GDownloadUrl("xml/<?php echo $inputfile; ?>", 
    					function(data) 
    					{
    						var xml = GXml.parse(data);
    						var markers = xml.documentElement.getElementsByTagName("marker");
    						
    						for (var i = 0; i < markers.length; i++) 
    						{
    							var point = new GLatLng(parseFloat(markers[i].getAttribute("lat")), parseFloat(markers[i].getAttribute("lng")));
    							var marker = new GMarker(point, iconBlue);
    							
    							// Marker direkt auf Map anzeigen
    							map.addOverlay(marker);
    							
    							bounds.extend(point);
    						}
    					}
    				);
    				
    				map.setCenter ( bounds.getCenter(), map.getBoundsZoomLevel(bounds) );
              	}
            }
    Das Script an sich funktioniert (wenn ich die map.setCenter manuell setze), aber die Boundaries rechnet er irgendwie nicht aus.

    Hier mal die Referenz zu den Bounds:
    http://code.google.com/intl/de-DE/ap...#GLatLngBounds

    Ich kenne mich mit JavaScript jetzt noch nicht so sehr aus, kann also sein dass es ein absolut doofer Fehler ist...

    Hoffe mir kann da jemand weiterhelfen

  • #2
    Sorry fürs hochpushen, aber es ist jetzt schon mehr als eine Woche her...
    Hat denn niemand hier mit Google Maps Erfahrung oder kann mir wenigstens sagen, was an meinem Code falsch ist?

    Kommentar


    • #3
      Ein problemloser testbares Beispiel würde deine Chancen auf Antwort sicher erhöhen.

      Kann es sein, dass der Request asynchron läuft und die Daten noch nicht da sind, wenn du map.setCenter() aufrufst? Vielleicht hilft es schon, den Befehl mit in die Callback-Funktion zu setzen. Das ist jetzt aber geraten.

      Kommentar


      • #4
        Erst mal vielen Dank für deine Antwort


        Viel mehr als den oben genannten Code gibt es eigentlich nicht.
        Aber hier nochmal der gesamte Quellcode, wenn's hilft:

        Code:
        <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
        <html xmlns="http://www.w3.org/1999/xhtml">
        <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <meta http-equiv="content-language" content="de" />
        <meta http-equiv="content-script-type" content="text/javascript" />
        <meta name="robots" content="noindex, nofollow" />
        <title>Google Maps Test</title>
        
        		<script src="http://maps.google.com/maps?file=api&v=2&key=<?php echo KEY; ?>" type="text/javascript"></script>
        		<script type="text/javascript" src="markerclusterer.js"></script>
                <script type="text/javascript">
                //<![CDATA[
            
                var iconBlue = new GIcon(); 
                iconBlue.image = 'http://labs.google.com/ridefinder/images/mm_20_blue.png';
                iconBlue.shadow = 'http://labs.google.com/ridefinder/images/mm_20_shadow.png';
                iconBlue.iconSize = new GSize(12, 20);
                iconBlue.shadowSize = new GSize(22, 20);
                iconBlue.iconAnchor = new GPoint(6, 20);
                iconBlue.infoWindowAnchor = new GPoint(5, 1);
            
                function load() 
                {
                	if (GBrowserIsCompatible()) 
        			{
                  		var map = new GMap2(document.getElementById("map"));
        				
                   		map.addControl(new GSmallMapControl());
        
        				var bounds = new GLatLngBounds();
        				
        				GDownloadUrl("xml/<?php echo $inputfile; ?>", 
        					function(data) 
        					{
        						var xml = GXml.parse(data);
        						var markers = xml.documentElement.getElementsByTagName("marker");
        						
        						// Array für Clustering erstellen
        						var clusterdata = [];
        						
        						for (var i = 0; i < markers.length; i++) 
        						{
        							var point = new GLatLng(parseFloat(markers[i].getAttribute("lat")),
        													parseFloat(markers[i].getAttribute("lng")));
        							var marker = new GMarker(point, iconBlue);
        							
        							// Marker direkt auf Map anzeigen
        							// map.addOverlay(marker);
        							
        							// Marker in Array fuer Clustering eintragen
        							clusterdata.push(marker);
        								
        							bounds.extend(point);
        						}
        						
        						// Marker Clustering berechnen und anzeigen
        						var markerCluster = new MarkerClusterer(map, clusterdata);
        					}
        				);
        				
        				map.setCenter ( bounds.getCenter(), map.getBoundsZoomLevel(bounds) );
                  	}
                }		    
                
                //]]>
                </script>
        </head>
        
        <body onload="load()" onunload="GUnload()">
        <div id="map" style="width: 650px; height: 450px"></div>';
        </body>
        
        </html>
        $inputfile ist halt ne xml-Datei mit Geodaten.


        Zu deiner Antwort: Das Problem bestünde doch dann, wenn map.setCenter vor dem Auslesen der xml-Datei aufgerufen wird. oder? Wie kann ich das überprüfen? Sry wenn ich mich hier blöd anstelle, ich habe mit JavaScript einfach nocht nicht genug Erfahrung...

        Kommentar


        • #5
          Aus der Doku zu GDownloadUrl:

          This function provides a convenient way to asynchronously retrieve a resource identified by a URL. [Hervorhebung hinzugefügt]
          - http://code.google.com/apis/maps/doc...l#GDownloadUrl

          Asynchron bedeutet, das Script, das den Request abschickt, läuft normal weiter. Es werden also die Folgezeilen ausgeführt. Wenn der Request vom Server beantwortet wurde, wird die entsprechend angegebene Callback-Funktion aufgerufen.

          Stichwort hier wäre „Ajax“.

          Kommentar


          • #6
            Danke für deine Hilfe

            Ich habe das map.setCenter jetzt einfach ans Ende der GDownloadUrl function geschrieben, und es funktioniert. War es das, was du mit callback-Funktion gemeint hast, oder wird das generell anders geschrieben?

            Kommentar


            • #7
              Das, was du für den Parameter onload an GDownloadUrl übergibst, nennt man eine Callback-Funktion.

              Kommentar

              Lädt...
              X