Hinzufügen eine Suche nach Postleitzahl in einer benutzerdefinierten Google Karte

StackOverflow https://stackoverflow.com/questions/1101063

  •  11-09-2019
  •  | 
  •  

Frage

Zuerst würde Ich mag sagen, dass ich neu auf dieser Seite bin, nie mit Google Maps API und habe eine sehr gute Kenntnisse von JavaScript gearbeitet.

Was ich getan habe: Ich habe ein ‚Store Locator‘ custom von Standorten zu einem Google ‚Meine Karten‘ hinzufügen. Ich habe dann eine Webseite mit einem Drop-Down-Menü und in Abhängigkeit von der Position, die Sie nach unten aus dem Dropdown auswählen, ändert sich die SRC für den iFrame die Karte hält. Also, wenn die Seite geladen wird Sie eine größere Karte im Maßstab sehen und von bestimmten Stellen ausgewählt hat, wird es die Karte zu diesem bestimmten Ort ändern (Zoom und Ernte).

Was muss ich tun: Was ich jetzt tun müssen, um diese Karte zu vervollständigen ist hinzuzufügen ein ‚Suche nach Postleitzahl‘, die dem Benutzer in ihren Postleitzahl erlauben zu setzen und die Web-Seite eine Liste der nächsten Orte zurückkehren und hoffentlich ihre Distanzen.

Hat jemand eine Idee haben, wenn ich in der Lage sein wird, die ‚Suche nach zip‘ -Funktionalität zu meinen benutzerdefinierten Google Karte hinzufügen?

Es gibt wirklich nicht viel zu meinem Code zu schreiben, aber wenn es hilft, werde ich gerne tun. Die aktuelle Funktionalität meiner Karte funktioniert gut, das Problem ist, dass ich weiß nicht, wo die Postleitzahl Suche beginnen hinzufügen.

Hier ist ein Link auf die Seite, die ich beziehe mich auf: http://74.53.82.155/ store-locator.htm

Jede Hilfe ist willkommen.

Vielen Dank im Voraus, gnrlchaos

War es hilfreich?

Lösung

Eine Option ist die geonames Web-Service zu nutzen, die Standorte von Postleitzahlen zurück . Hier ist ein kleines Beispiel dafür, wie diese Web-Service mit Dojo zu verwenden. 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title></title>
        <link rel="stylesheet" type="text/css" href="layout.css">
        <script type="text/javascript">var djConfig = { parseOnLoad: true }</script>
        <script type="text/javascript" src="../dojo-release-1.3.0/dojo/dojo.js"></script>
        </script>
        <script type="text/javascript">
            dojo.require("dojo.io.script");
                function getPlace() {
        var zip = dojo.byId('zipcode').value;
        console.log('zip is ', zip);
        //use country code to get results for a specific country
        //var gn_url = 'http://ws.geonames.org/postalCodeLookupJSON?postalcode=' + zip + '&country=US';
        var gn_url = 'http://ws.geonames.org/postalCodeLookupJSON?postalcode=' + zip;
        console.log(gn_url);
        dojo.io.script.get({
          url: gn_url, 
          callbackParamName: "callback",
          load:function(response, io) { 
            console.log('got json.'); 
            console.dir(response); 
            places = response.postalcodes; 
            var infos = []
            dojo.forEach(places, function(p, i) {
                infos[i] = p.placeName + ', ' + p.adminName1 + ', Lat: ' + p.lat + '; Long: ' + p.lng + '<br />';
            });
                dojo.byId('postalCode').innerHTML = infos.join('');
          }, 
          error:errorCb
        });   
        }

        function errorCb(type, data, evt){
                debug(data);
        }
         </script>
     </head>
     <body class="tundra">
    Enter a zip code: <input id="zipcode" type="text" /> <button onclick="getPlace(); return false;" value="Find Place.">Find Place.</button>
      <div>Places:</div><div id="postalCode"></div>
    </body>
</html>

Andere Tipps

Ich weiß nicht, von irgendeiner Weise mit einer eingebettet Google Map in der Art und Weise zu interagieren, die Sie wollen. Die beste Möglichkeit wäre, Ihre eigene Karte mit dem Google Maps API zu erstellen. Google hat einige große Dokumentation und Beispiele den Start.

Hallo, ich bin auch auf eine ähnliche Suche zu arbeiten. Ich fand eine ziemlich gute Diskussion der Mathematik beteiligt, sowie Links auf Queries und Formeln, hier: http: / /uclue.com/?xq=2861 . hoffe, das hilft.

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top