Upptäck plats med hjälp av Google AJAX API (JavaScript)

Det finns tillfällen då man behöver ta reda på vilken del av världen en viss besökare kommer ifrån. Det finns många IP-till-plats-leverantörer där ute, som erbjuder denna tjänst till en rimlig kostnad (beroende på hur mycket detalj du behöver).

Googles AJAX Maps API ger dig en kostnadsfri uppfattning (så länge dina behov är icke-kommersiella). Du kan även använda latitud- och longitudinformationen som returneras av API: n för att plotta användarens plats på en Google Map. Nifty eh? Låt oss nu titta på ett enkelt exempel - vi kommer att upptäcka användarens plats baserat på hans IP-adress och göra det på en karta.

Innan vi börjar kan du kolla in demoen.

Du måste först få en AJAX Search API Key (det är gratis, registrera dig bara med ditt domännamn, och du får en unik nyckel, som gäller för alla sidor som är värd inom din domän). När du har det klart, skjuter du upp din favoritredigerare. Vi behöver inte någon serverns sidkod för att kunna använda Maps API - så ett vanligt HTML-dokument räcker.

Låt oss först placera krokarna? på sidan, där kartan och en bildtext kommer att visas.

Google AJAX API består av en samling av enskilda API: er. Genom att använda en google.load ("maps", "2", {callback: initialize});

Lastfunktionen ovan tar API-namnet, dess version och en valfri återuppringningsfunktion (som kallas en gång Maps API har slutförts) som parametrar. I init () -funktionen definierar vi först en standardplats som ska visas på kartan, om Maps API inte kan avkoda besökarens IP-adress. Eftersom kartgränssnittet i grunden matchar användarens IP-adress till en plats, kan det hända att det inte finns några tillfällen när denna mappning är möjlig, och därmed behovet av en standard.

      var zoom = 4; var latlng = nya google.maps.LatLng (50, -10); var location = "Visar standardplats för karta.";      Därefter kontrollerar vi om klientens plats fylldes i av API-läsaren. Om det är korrekt fyllt har google.loader.ClientLocation-objektet följande egenskaper:
  ClientLocation.latitude
 ClientLocation.longitude
 ClientLocation.address.city
 ClientLocation.address.country
 ClientLocation.address.country_code
 ClientLocation.address.region
 
 Med hjälp av denna information kan vi enkelt ladda en karta, centrerad på användarens plats.
      document.getElementById ("plats"). innerHTML = plats; // plats som texttexttext var map = nytt google.maps.Map2 (document.getElementById ('map')); map.setCenter (latlng, zoom); map.addControl (new GLargeMapControl ()); map.addControl (ny GMapTypeControl ());      Det är det, se det i aktion. Som jag redan har sagt ovan är klientens platsinformation som returneras av detta API inte perfekt, eftersom IP-kartläggning ofta kan vara svårt och kan resultera i felaktig eller delvis korrekt information. Medan du bör överväga att gå för en företagslös lösning för allvarliga användningsområden hoppas jag att detta API kommer att vara användbart för dina personliga behov!