Kako dodati zemljevide v svojo aplikacijo: vdelave, interaktivni zemljevidi in iskalniki lokacij

Zemljevid v svojo aplikacijo dodate tako, da najprej odločite, ali potrebujete statično vdelavo (ena lokacija s točko, kot »poiščite našo trgovino«) ali interaktivni zemljevid (veliko točk iz vaših podatkov, filtri, združevanje, »v bližini«). Za eno lokacijo je vdelan zemljevid najhitrejši in z Googlovim Maps Embed API brezplačen. Za interaktivne zemljevide uporabite knjižnico JavaScript za zemljevide — Google Maps JavaScript API, Mapbox GL JS ali odprtokodni Leaflet s ponudnikom ploščic — za vsako mesto v bazi shranite zemljepisno širino in dolžino ter svoj ključ API omejite na svojo domeno. Podatki o ponudnikih spodaj so iz njihove dokumentacije, stanje september 2026.

Kakšen zemljevid potrebujete?

Večina majhnih poslovnih strani potrebuje samo prvo vrstico. Imeniki, tržnice in strani z oglasi potrebujejo tretjo in četrto.

Vaše možnosti

Google Maps Platform

Googleov vodnik za začetek pravi, da morate ustvariti Cloud projekt z omogočenim zaračunavanjem in omogočiti API-je, ki jih želite. Njegove cene po porabi dajejo SKU Essentials, vključno z Dynamic Maps, mesečni brezplačni obseg 10.000 dogodkov, za Dynamic Maps pa navaja 7,00 USD na 1.000 dogodkov nad tem (pri prvi stopnji obsega). SKU Maps Embed je naveden kot neomejen in brezplačen. Google prodaja tudi mesečne naročniške načrte. Za trenutne številke glejte cene Google Maps Platform.

Mapbox

Cenik Mapbox navaja 50.000 brezplačnih mesečnih nalaganj zemljevida za Mapbox GL JS na spletu, nato 5,00 USD na 1.000 nalaganj. Glejte cene Mapbox.

Leaflet in OpenStreetMap

Leaflet se opisuje kot odprtokodna knjižnica JavaScript za interaktivne zemljevide, prijazne mobilnim napravam, velika približno 42 KB JavaScripta. Potrebuje ploščice zemljevida (slike zemljevida) iz nekega vira. Javni strežniki ploščic OpenStreetMap so mamljivi, vendar pravilnik o uporabi ploščic zahteva vidno navedbo avtorstva, prepoveduje množično prenašanje, ne ponuja jamstva za storitev in komercialne storitve opozarja, da se dostop lahko odvzame. Za resničen izdelek uporabite komercialni ali lastno gostovani vir ploščic, ki deluje z Leafletom.

Ključi API: javni, a omejeni

Ključi za zemljevide, uporabljeni v brskalniku, so vidni vsakomur, ki odpre vašo stran. To je pričakovano, vendar pomeni, da lahko nekdo kopira vaš ključ in povzroči visok račun. Googlova varnostna navodila so dodati omejitve spletnega mesta (HTTP referrer) s seznamom vaših domen in omejitve API-jev, da ključ deluje samo za API-je, ki jih uporabljate.

Ključi za storitve na strežniku — na primer geokodiranje tisočih naslovov — morajo biti ločeni ključi, shranjeni kot tajnosti na strežniku, ne na strani. Prav tako v konzoli ponudnika nastavite opozorila o proračunu ali kvote, da napaka ne more postati velik račun.

Geokodiranje: enkrat pretvorite naslove v koordinate

Zemljevidi prikazujejo zemljepisno širino in dolžino, ne naslovov. Pretvorba naslova v koordinate se imenuje geokodiranje, večina ponudnikov pa ga zaračunava na zahtevo. Učinkovit vzorec:

1. Ko se seznam shrani, na strežniku geokodirajte njegov naslov.
2. V bazi podatkov shranite zemljepisno širino in dolžino.
3. Zemljevid bere shranjene koordinate; nikoli ne geokodira ob ogledu strani.

Preverite pogoje vsakega ponudnika glede tega, kako dolgo smete hraniti rezultate geokodiranja; razlikujejo se.

Primeri pozivov

Ena vdelana karta:

Na kontaktni strani dodaj vdelan Google zemljevid, ki prikazuje naš naslov (12 High Street, Leeds), z uporabo Maps Embed API s ključem v GOOGLE_MAPS_EMBED_KEY. Pod njim dodaj povezavo »Navodila za pot«. Na telefonih naj bo čez celotno širino in naj se naloži leno.

Interaktivni zemljevid seznamov:

V tabelo listings dodaj zemljepisno širino in dolžino. Ko se seznam ustvari ali se mu naslov spremeni, ga na strežniku geokodiraj s ključem v GEOCODING_API_KEY in shrani koordinate. Na strani Browse prikaži zemljevid z oznako za vsak seznam z uporabo Leaflet, s združevanjem, kadar se oznake prekrivajo. Klik na oznako pokaže naslov, ceno in povezavo. Zemljevid in seznam naj uporabljata iste filtre.

»V bližini«:

Dodaj gumb »V bližini«, ki od obiskovalca zahteva njegovo lokacijo in prikaže sezname v radiju 10 km, razvrščene po razdalji. Če lokacijo zavrne, naj lahko vpiše mesto.

Korak za korakom

1. Izberite vrsto zemljevida iz tabele na vrhu.
2. Ustvarite račun pri ponudniku in projekt ter omogočite samo API-je, ki jih potrebujete.
3. Ustvarite ključe: ključ za brskalnik, omejen na vaše domene (vključno z domeno predogleda med gradnjo), in po potrebi ključ za strežnik za geokodiranje.
4. Shranite ključe kot tajnosti in svojemu graditelju naročite, naj jih uporabi; ključ za brskalnik je kljub temu omejen, čeprav konča na strani.
5. Shranite koordinate za vsak kraj v svoji bazi.
6. Zgradite zemljevid: oznake, pojavna okna, združevanje in smiseln privzeti približek.
7. Združite ga s seznamom. Sam zemljevid je na telefonu in za bralnike zaslona težko uporaben. Prikažite iste rezultate še kot seznam.
8. Nastavite opozorilo o proračunu v konzoli ponudnika.
9. Objavite in preizkusite na živi domeni, saj omejitve sklicevanja pogosto blokirajo zemljevid, dokler ne dodate žive domene.

Pogoste napake

• Neomejeni ključi. Kdorkoli jih lahko ponovno uporabi na svojem spletnem mestu.
• Geokodiranje ob vsakem ogledu strani. Počasno in drago; geokodirajte enkrat ob shranjevanju.
• Pozaba žive domene v omejitvah ključa. Deluje v predogledu, v produkciji pa prazen sivi okvir.
• Postavitve samo z zemljevidom. Točke brez seznama so na majhnih zaslonih boleče in niso dostopne.
• Sto oznak brez združevanja. Nerazumljivo in počasno.
• Manjkajoče navedbe avtorstva. Večina ponudnikov zemljevidov in ploščic zahteva navedbo, njeno skrivanje pa krši njihove pogoje.
• Prošnja za lokacijo ob nalaganju strani. Vprašajte samo, ko uporabnik tapne »V bližini«.

Kontrolni seznam

• Izbrana pravilna vrsta zemljevida za nalogo
• Ključ za brskalnik omejen na vaše domene in zahtevane API-je
• Ključi za strežnik shranjeni v tajnostih
• Koordinate shranjene v bazi, geokodirane enkrat
• Rezultati so prikazani tudi kot seznam
• Združevanje za veliko oznak
• Navedba avtorstva je vidna
• Nastavljeno opozorilo o proračunu pri ponudniku
• Preizkušeno na objavljeni domeni in na telefonu

Dodajanje zemljevidov z Mythexom

Mythex nima vgrajene integracije zemljevidov; prinesete svoj ključ ponudnika, ga dodate kot tajnost projekta (ali ga prilepite, ko agent pokaže kartico s tajnostmi) in v klepetu zahtevate zemljevid, kot je opisano v Integrate any API. Koordinate gredo v bazo podatkov projekta. Ne pozabite dodati tako predogledne kot objavljene domene v omejitve spletnega mesta ključa in po spremembi tajnosti znova objavite.

Zemljevidi običajno stojijo ob iskanju in seznamih: glejte kako dodati iskanje v svojo aplikacijo, kako zgraditi spletni imenik in kako zgraditi spletno stran za majhno podjetje.

Vprašanja