Vad du ska veta
- Gå till Google Cloud Platform Console och skapa eller välj ett projekt och klicka sedan på Fortsätt. På sidan Inloggningsuppgifter får du en API-nyckel
.
Visa dem vägen: Bädda in en Google-karta på en webbplats
Den här artikeln förklarar hur du infogar en Google-karta med en platsmarkör på din webbsida. Denna process inkluderar att hämta en speciell mjukvarunyckel från Google och sedan lägga till relevant JavaScript till sidan.
Erhåller na Google Maps API Key
För att skydda sina servrar från att bombarderas av förfrågningar om kartor och platssökningar, stryper Google åtkomsten till sin kartdatabas. Du måste registrera dig hos Google som utvecklare för att få en unik nyckel för att använda applikationsprogrammeringsgränssnittet för att begära data från Maps-servrarna. API-nyckeln är gratis såvida du inte behöver kraftig åtkomst till Googles servrar (till exempel för att utveckla en webbapp).
På Inloggningsuppgifter sida, skaffa en API-nyckel. Vid behov, ställ in relevanta begränsningar för nyckeln.
Säkra din API-nyckel med hjälp av bästa praxis rekommenderas av Google.
Om du tror att du måste visa kartan oftare än din kostnadsfria kvot tillåter, skapa ett faktureringsavtal med Google. De flesta webbplatser, särskilt lågtrafikerade bloggar eller nischwebbplatser, kommer sannolikt inte att förbruka mycket av kvottilldelningen.
Infoga JavaScript på din webbsida
Infoga följande kod i din Webbsida, i BODY-delen av HTML-dokumentet:
// Initiera och lägg till kartfunktionen initMap {
// Platsen för flaggan var flagga = {lat: XXX, lng: YYY};
- Ersätt flagga med ett namn som refererar till platsen du fäster. Håll det enkelt och kort (som
hem
eller kontor
eller
Paris
eller detroit
). Du kan köra den här koden och lämna flagga som den är, men att ändra namnet stöder återanvändning av den här koden på samma sida, för att bädda in flera olika kartor.
- Ersätt XXX och ÅÅÅ med latitud och longitud, i decimaler, för platsen för kartans markör. Du måste ersätta dessa värden för att kartan ska visas korrekt. Ett enkelt sätt att hitta latitud och longitud är att öppna Google Maps och högerklicka på den exakta platsen du tänker flagga. I snabbmenyn väljer du Vad är här? för att se latitud och longitud.
- // Kartan, centrerad vid flaggan var map = new google.maps.Map( document.getElementById('map'), {zoom: 4, center: flagga});// Markören, placerad vid flaggan var markör = ny google.maps.Marker ({position: flagga, karta: karta}); } src=’https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap’>
- Ändra följande i denna kod:
