Ankündigung

Einklappen
Keine Ankündigung bisher.

Google Maps API V3 - mySQL

Einklappen

Neue Werbung 2019

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

  • Google Maps API V3 - mySQL

    Schönen guten Morgen liebes Forum,

    ich lese hier schon einige Zeit mit und muss sagen, dass mir das schon sehr viel gebracht hat und ich schon viel gelernt habe. Leider stehe ich seit gestern vor einem Problem bei welchem ich leider keinen Lösungsansatz finde.
    Ich versuche Adressen von einem mySQL Server in einer googleMaps Karte darstellen zu lassen.

    PHP-Code:
    <body onload="initialize()" onunload="GUnload()">
    //some other code...

    <script src="http://maps.google.com/maps?file=api&v=2.x&key=
        mein_key" type="text/javascript"></script>
        <script type="text/javascript">
            

        var map = null;
        var geocoder = null;

        function initialize() {
          if (GBrowserIsCompatible()) {
            map = new GMap2(document.getElementById("map_canvas"));
            map.setCenter(new GLatLng(53.5495867, 9.9624358), 3  );
            map.addControl(new GLargeMapControl());
            map.addControl(new GMapTypeControl());
            map.addControl(new GScaleControl());
            map.addControl(new GOverviewMapControl());
            geocoder = new GClientGeocoder();
    //funktioniert problemlos        
    showAddress("<?php echo $customeraddress.  " " .$customerpostcode" "  .$customercity" " .$customercountry?>"); //this customer
            <?php
    //hier habe ich mein Problem
            
    $strnext "SELECT customeraddress, customerpostcode, customercity, customercountry FROM tblcustomers WHERE salesmanager='".$userid."'";
            
    $resultnext mysqli_query($con$strnext);
            while(
    $rownext mysqli_fetch_array($resultnext)) {
                
    $next $rownext['customeraddress']. " " .$rownext['customerpostcode']. " " .$rownext['customercity']. " " .$rownext['customercountry'];
                echo 
    'showAddress("' .$next.'"); ';
            }
            
    ?>
              
          }
        }
               
        function showAddress(address) {
          if (geocoder) {
            geocoder.getLatLng(
              address,
              function(point) {
                if (!point) {
                  //alert(address + " nicht gefunden");
                  next;
                } else {
                  map.setCenter(point, 9);
                  var marker = new GMarker(point);
                  map.addOverlay(marker);
                 //marker.openInfoWindowHtml("<br \/>Längengrad: <strong>"+point.lng()+"<\/strong><br \/>Breitengrad: <strong>"+point.lat()+"<\/strong>");
                  
                  GEvent.addListener(map, "click", function(markersetzen, point) {
                      map.clearOverlays();
                    marker = new GMarker(point);
                    map.addOverlay(marker);
                    marker.openInfoWindowHtml("<br \/>Längengrad: <strong>"+point.lng()+"<\/strong><br \/>Breitengrad: <strong>"+point.lat()+"<\/strong>");
                  });
                }
              }
            );
          }
        }
        </script>
         
        <div id="map_canvas" style="width: 750px; height: 300px"></div>
    Via showAddress wird der Marker gesetzt. Das funktioniert beim ersten Punkt ohne Probleme. Nun möchte ich jedoch alle Kunden aus der tblcustomers mir darstellen lassen. Füge ich den Code wie oben ein bleibt mein Bildschirm weiß. Setzte ich manuell mit dem showAddress weitere Städte ein z.B.
    PHP-Code:
    showAddress("Berlin");
    showAddress("Hamburg");
    showAddress("Stuttgart"); 
    werden mir alle Punkte korrekt dargestellt.
    Ich weiß, dass das Script eigentlich für geocoding geschrieben ist, allerdings kann man es, wie ich finde schön umbauen...
    Hat von euch jemand eine Idee wie ich das hinbekommen könnte?

    Besten Dank und viele Grüße
    Daniel

  • #2
    Wie sieht denn das erzeugte HTML aus und was meldet z.B. FireBug (oder welches Developertool auch immer du verwendest)?
    VokeIT GmbH & Co. KG - VokeIT-oss @ github

    Kommentar


    • #3
      Zitat von mindstormHN Beitrag anzeigen
      Code:
      <script src="http://maps.google.com/maps?file=api&v=2.x&key=mein_key" type="text/javascript">
      map = new GMap2(document.getElementById("map_canvas"));
      Bist du dir sicher, dass du die Google-Maps-API in Version 3 benutzt?

      Kommentar


      • #4
        ich denke schon:
        http://maps.google.com/maps?file=api&ydasfcvdsf

        Kommentar


        • #5
          Hallöchen,

          da ich aktuell sehr intensiv mit der Google Maps API arbeite, habe ich da ein paar Anmerkungen:

          - Zur Inspiration solltest du dir zunächst SOLID zu Gemüte führen.
          - Angular Google Maps macht einem das Leben deutlich einfacher (AngularJS required).
          - Wieso geocodierst du die Adressen nicht bereits serverseitig und lieferst diese aus? Bspw. mit Geocoder-PHP.
          - Du solltest die Marker zunächst in einem Array ausgeben, welches du später weiterverarbeiten kannst (siehe Beispiel unten). Dieser JavaScript-PHP Salat ist doch für die Tonne, zumal dort auch noch SQL-Statements abgefeuert werden.

          HTML-Code:
          <script>
              markers = <?php json_encode($markers); ?>;
          </script>
          Generell würde ich dir dazu raten, nicht alles an Ort und Stelle zu erledigen, sondern dein Problem in sinnvolle Teilaufgaben zu zerlegen und diese in spezifischen Klassen abzubilden. Das erleichtert die Wartung und du behältst deutlich länger den Überblick.

          Viele Grüße,
          lotti
          [SIZE="1"]Atwood's Law: any application that can be written in JavaScript, will eventually be written in JavaScript.[/SIZE]

          Kommentar


          • #6
            Zitat von lottikarotti Beitrag anzeigen
            (..)
            - Angular Google Maps macht einem das Leben deutlich einfacher (AngularJS required).
            ausser dass es angular basiert, ist da was wesentlich komfortabler als:
            http://hpneo.github.io/gmaps/examples/basic.html

            Kommentar


            • #7
              Hallo zusammen,

              Erstmal vielen Dank für eure Hilfe. Werde mir die Links und Anregungen zu Herzen nehmen und heute Abend noch ein wenig coden... Natürlich halte ich euch auf dem laufenden und poste auch gerne (wenn ich es dann habe) meine Lösung.
              Aber vorerst bleibt mir nur zu sagen "Danke"!

              Viele Grüße aus den Niederlanden
              Daniel

              Kommentar


              • #8
                Hallöchen,

                Zitat von moma Beitrag anzeigen
                ausser dass es angular basiert, ..
                Was braucht es denn mehr? Marker-Clustering?

                Viele Grüße,
                lotti
                [SIZE="1"]Atwood's Law: any application that can be written in JavaScript, will eventually be written in JavaScript.[/SIZE]

                Kommentar


                • #9
                  Zitat von lottikarotti Beitrag anzeigen
                  Hallöchen,


                  Was braucht es denn mehr? Marker-Clustering?

                  Viele Grüße,
                  lotti
                  nope:
                  https://github.com/HPNeo/gmaps/blob/...clusterer.html
                  https://github.com/HPNeo/gmaps/issues/92

                  Kommentar


                  • #10
                    Hallöchen,

                    sorry, muss ich in der extrem geilen Doku übersehen haben.

                    Viele Grüße,
                    lotti
                    [SIZE="1"]Atwood's Law: any application that can be written in JavaScript, will eventually be written in JavaScript.[/SIZE]

                    Kommentar


                    • #11
                      handicap verbessern würd ich sagen: wer sucht denn heutzutage infos in ner docu, da steht sowieso nur die hälfte drin.

                      Kommentar

                      Lädt...
                      X