Hvordan legge til et Google-kart på en webside med API

For å sette inn et Google-kart med en stedsmarkør på websiden din, må du skaffe deg en spesiell programvarenøkkel fra Google, og deretter legge til relevant JavaScript på siden. Selv om prosessen er grei, hjelper det å ha minst kortvarig bakgrunnskunnskap om HTML og JavaScript.


Få en Google Maps API-nøkkel

For å beskytte serverne sine fra å bli bombardert av forespørsler om kart og lokalitetsoppslag, sperrer Google tilgang til Maps-databasen. Du må registrere deg hos Google som utvikler for å få en unik nøkkel for å bruke applikasjonsprogrammeringsgrensesnittet til å be om data fra Maps-serverne. API-nøkkelen er gratis med mindre du trenger tung tilgang til Googles servere (for eksempel for å utvikle en webapp).

Slik registrerer du API-nøkkelen:

  1. Gå til Google Cloud Platform Console, og etter å ha logget på med Google-kontoen din, opprett et nytt prosjekt eller velg et eksisterende.

  2. Klikk Fortsett for å aktivere API og eventuelle relaterte tjenester.

  3. På Credentials side, få en API-nøkkel. Sett om nødvendig relevante begrensninger på nøkkelen.

  4. Sikre API-nøkkelen din ved å bruke beste fremgangsmåter anbefalt av Google.

Hvis du mener at du må ha kartet vist oftere enn den gratis kvoten din tillater, kan du sette opp en faktureringsordning med Google. Det er usannsynlig at de fleste nettsteder - spesielt blogger eller nisjesider med lite trafikk - bruker mye av kvotetildelingen.


Sett inn JavaScript på websiden din

Sett inn følgende kode på websiden din i BODY-delen av HTML-dokumentet:

// Initialiser og legg til kartet
funksjon initMap () {
// Plasseringen av flagget
var flagg = {lat: XXX, lng: ÅÅÅ};
// Kartet, sentrert ved flagget
var map = ny google.maps.Map (
document.getElementById ('map'), {zoom: 4, center: flag});
// Markøren, plassert ved flagget
var marker = new google.maps.Marker ({posisjon: flagg, kart: kart});
}

<script async defer
src = "https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap">

Legg igjen en kommentar