Google Maps uden en API-nøgle

Normalt, når du integrerer Google Maps, arbejder du med Maps JavaScript API , som kræver en API-nøgle og kan medføre omkostninger, der ikke bør undervurderes med højere adgangsnumre. Der er gode alternativer såsom mapbox eller OpenStreetMap , men de opnår endnu ikke de mange funktioner, der tilbydes af Google. Google tilbyder også en måde uden en API-nøgle via delingsfunktionen, som vi kan bruge til vores formål.


Denne sti kan bruges programmatisk til at udsende en hvilken som helst adresse (selv uden at kende breddegrad og længdegrad). Derudover indeholder kortet (i modsætning til JS-modstykket) et link til ruteplanlæggeren. Kortet kan også sprøjtes op ved hjælp af CSS-filtre (skønt resultatet ikke helt kommer tæt på de oprindelige stilarter, der er mulige med JS API).

I mange år var måden at gøre dette på via parameteren output = embed , som Google ikke officielt understøtter, og så er skærmfejl steget i den seneste tid:

331190767bb32b2468632e609223c53e

Hvis du bruger den officielle delefunktion via maps.google.de , får du f.eks. Følgende kode:

331190767bb32b2468632e609223c53e

Hvis vi strukturerer den lange URL i src- parameteren, resulterer et mønster:

331190767bb32b2468632e609223c53e

Vi genkender følgende datatyper:

  • m: matrix
  • s: streng
  • f: flyde
  • d: Dobbelt
  • i: heltal
  • e: enum

Efter et par forsøg og fejlforsøg kan vi fjerne nogle værdier og pakke de vigtigste værdier i variabler, for eksempel for dynamisk at definere adressen:

331190767bb32b2468632e609223c53e

Endelig kan vi tilføje et pænere blik på kortet, for eksempel ved hjælp af følgende CSS-kode:

331190767bb32b2468632e609223c53e

I sidste ende får vi et gratis, dynamisk kort, der fungerer pålideligt:

Tilbage