Selv om det er så mange kartlegging-apper og-tjenester ut der for å få deg fra punkt A til punkt B, den absolutte kongen av kartene er Google Maps. Jeg bruker den på min datamaskin, tablet og 90% av tiden på smarttelefonen min. Det fikk det beste av data, er det mest navigasjon og alternativer for ruting og kule funksjoner som Street View og gåing, sykling og kollektivtransport info.
Men hva hvis du trenger å bruke et kart eller veibeskrivelse utenfor Googles hjemmeside? Anta at du har ditt eget bryllup nettside eller en personlig blogg, og du kan besøke nettstedet ditt, skriv inn den adressen de kommer fra og automatisk få veibeskrivelser til hendelsen sted!
Vel, det er et par måter du kan gå om å oppnå dette. Den enkleste måten er å bare legge inn kart på nettsiden din ved hjelp av den innebygde kode generert av Google Maps. Den andre måten er litt mer teknisk, men mer passelig og dynamisk. Jeg vil nevne begge metodene nedenfor.
Legge Inn Google Kart
Hvis du bare ønsker å vise retningene fra ett sted til et annet, er den enkleste tingen å gjøre er å legge inn hva kartet du viser ved hjelp av den innebygde koden. Først, gå videre og oppsett uansett retningene du vil i Google Maps og deretter klikk på gear-ikonet nederst til høyre på siden.
Klikk på Del eller legge inn kart og deretter klikker du på Legge inn kart – fanen. Her kan du velge en størrelse for din kartet og deretter kopiere iframe-kode og slippe det på hvilken som helst nettside du liker.
Den eneste ulempen med denne metoden er at brukeren bare ser en statisk kartet. I den andre metoden nedenfor, kan du lage et skjema hvor brukeren kan skrive inn en start-adresse, og det vil generere et kart fra adressen til en adresse av ditt valg.
Opprett En Google Maps-Form
For å illustrere hva jeg mener med den andre metoden, kan du gå videre og skriv inn et OSS-postadresse i boksen under for å få veibeskrivelser ut fra din posisjon til huset mitt:
Skriv inn start-adresse:
Kult ikke sant? Du kan enkelt lage denne lille skjema på en nettside, blogg, eller hvor som helst du kan sette i noen HTML-koden! Dette er også stor for small business nettsteder som du kan kaste den opp på kontakt-siden, og folk kan få veibeskrivelser raskt, i stedet for å kopiere adressen din, kan du åpne et nytt vindu, og skriv deretter inn i deres start-adresse.
Så hvordan vi går om å skape denne modifiserte få veibeskrivelse boksen? Vel for det første, vi trenger å få riktig syntaks for NETTADRESSE som Google bruker for veibeskrivelse. Heldigvis, kan vi finne ut ved å få veibeskrivelser mellom to steder og så er det bare å kopiere URL-adressen fra adressefeltet. Du kan også klikke på den lille gear-ikonet nederst til høyre på siden, og velg Del eller legge inn kart.
Del linken kategorien inneholder URL-adressen, som er den samme URL-adressen i nettleserens adressefelt. Jeg ‘ve gått foran og limes inn hele URL-adressen nedenfor bare for å vise deg hva det ser ut som.
https://www.google.com/maps/dir/3600+Thorp+Springs+Dr,+Plano,+TX+75025,+USA/ 854+Deerfield+Rd,+Allen,+TX+75013,+USA/@33.1125686,-96.7557749,13 z/ data=!3m1!4b1!4m13!4m12!1m5!1m1!1s0x864c3d45018517a5:0xbabd3c91a1321997!2m2!1d-96.762484!2d33.08947!1m5!1m1! 1s0x864c16d3018a7f4f:0xab2052b5786cd29f!2m2!1d-96.666151!2d33.133892
Yikes! Det er ganske lenge! Det er en rekke ting i det, de fleste som ikke gjør noe fornuftig! Google Maps URL-parametre som brukes til å være veldig grei og enkel, men den nye URL-strukturen er ganske komplisert. Heldigvis, kan du fremdeles bruke den gamle parametere og Google vil konvertere dem til den nye versjonen automatisk. For å se hva jeg mener, sjekk ut linken nedenfor.
http://maps.google.com/maps?saddr=start&daddr=end
Gå foran og gi det en sjanse. Sette inn en adresse i anførselstegn for start-og slutt-adressen og lime inn URL-adressen i nettleseren din! Jeg har erstattet start med min hjemby, New Orleans, og avslutt med Houston, TX, så dette er hva min Google Maps veibeskrivelse URL ser ut som:
http://maps.google.com/maps?saddr=”new orleans, la”&daddr=”houston, tx”
Det fungerer! Som du kan se, skjønt, Google Maps konverterer linker til noe langt mer komplisert når kartet fullt laster. Ok, så nå som vi har en fornuftig URL-adresse som vi kan sende til Google Maps, må vi lage en enkel form med to felt, ett for å starte adresse og ett for adresse.
Hvis du vil at folk skal bare skriv inn adressen og få veibeskrivelse til ditt sted, så får vi ønsker at det andre feltet for å være skjult, og som allerede er satt til adresse.
<form action=”http://maps.google.com/maps” method=”get” target=”_blank”>
Skriv inn start-adresse:
<input type=”text” name=”saddr” />
<input type=”hidden” name=”daddr” value=”854 Deerfield Rd, Allen, TX” />
<input type=”submit” value=”få veibeskrivelse” />
</form>
Sjekk ut koden ovenfor. Den første linjen starter ut skjema og sier at da send-knappen er klikket, data sendes til maps.google.com/maps. De target=blank betyr at vi ønsker at resultatet skal åpnes i et nytt vindu. Da har vi en tekstboks for å starte adresse, som er tom.
Den andre tekstboksen er skjult, og-verdien er den adressen som vi ønsker. Til slutt, det er en send-knapp med tittelen “Få Veibeskrivelse”. Nå når noen skriver inn sin adresse, vil de få dette:
Du kan tilpasse veibeskrivelse og kart enda mer med et par ekstra parametre. For eksempel, la oss si at du ikke vil ha det som standard til å være kart, men i stedet vil det bli Satellitt og vis Trafikk.
http://maps.google.com/maps?saddr=%22new+orleans,+la%22&daddr=%22houston,+tx%22&ie=UTF8&t=h&z=7&layer=t
Legg merke til de lag=t og t=h feltene i URL-en. lag=t er for trafikken lag og t=h betyr hybrid kart! t kan også bli satt til m for vanlig kart, k for satellitt-og s for terreng. z er zoom-nivå, og du kan endre den fra 1 til 20. I NETTADRESSEN ovenfor, det er satt til 7. Bare takle de på til siste URL-adresse, og du har nå fått en svært tilpasset Google-Kart Få Veibeskrivelse-skjema på ditt nettsted!
Har noen problemer med denne, kan du legge inn en kommentar og jeg skal prøve å hjelpe! Nyt!