Kaip pridėti žemėlapius prie savo programėlės: įterpimai, interaktyvūs žemėlapiai ir parduotuvių paieška

Norėdami pridėti žemėlapį prie programėlės, pirmiausia nuspręskite, ar jums reikia statinio įterpimo (vienos vietos su žymekliu, pavyzdžiui, „raskite mūsų parduotuvę“), ar interaktyvaus žemėlapio (daug žymeklių iš jūsų duomenų, filtrai, grupavimas, „netoliese“). Vienai vietai įterptas žemėlapis yra greičiausias ir, naudojant Google Maps Embed API, nemokamas. Interaktyviems žemėlapiams naudokite JavaScript žemėlapių biblioteką – Google Maps JavaScript API, Mapbox GL JS arba atvirojo kodo Leaflet su plytelių tiekėju – kiekvienos vietos platumą ir ilgumą saugokite duomenų bazėje, o API raktą apribokite savo domenu. Tiekėjų informacija žemiau pateikta pagal kiekvieno tiekėjo dokumentaciją 2026 m. rugsėjo duomenimis.

Kokio žemėlapio jums reikia?

Daugumai mažų verslo svetainių reikia tik pirmos eilutės. Katalogams, prekyvietėms ir skelbimų svetainėms reikalingos trečia ir ketvirta.

Jūsų parinktys

Google Maps Platform

Google pradžios vadove nurodoma, kad reikia sukurti Cloud projektą su įjungtu mokėjimu ir įjungti norimas API. Jų mokėjimo pagal naudojimą kainodara suteikia Essentials SKU, įskaitant Dynamic Maps, 10 000 įvykių nemokamą mėnesio ribą, o virš jos Dynamic Maps nurodomas 7,00 USD už 1 000 įvykių (pirmoje apimties pakopoje). Maps Embed SKU nurodomas kaip neribotas ir nemokamas. Google taip pat parduoda mėnesines prenumeratos planus. Dabartinius skaičius rasite Google Maps Platform kainose.

Mapbox

Mapbox kainų puslapyje nurodyta 50 000 nemokamų mėnesio žemėlapio įkėlimų Mapbox GL JS žiniatinklyje, o toliau – 5,00 USD už 1 000 įkėlimų. Žr. Mapbox kainas.

Leaflet ir OpenStreetMap

Leaflet save apibūdina kaip atvirojo kodo JavaScript biblioteką mobiliesiems draugiškiems interaktyviems žemėlapiams, maždaug 42 KB JavaScript. Jai reikia žemėlapio plytelių (žemėlapio paveikslėlių) iš kažkur. OpenStreetMap viešieji plytelių serveriai vilioja, bet plytelių naudojimo politika reikalauja matomo šaltinio nurodymo, draudžia masinį atsisiuntimą, nesuteikia paslaugos garantijos ir įspėja, kad komercinėms paslaugoms prieiga gali būti panaikinta. Realiam produktui naudokite komercinį ar savo talpinamą plytelių šaltinį, kuris veikia su Leaflet.

API raktai: vieši, bet apriboti

Naršyklėje naudojami žemėlapių raktai matomi kiekvienam, kas atidaro jūsų puslapį. Tai normalu, bet tai reiškia, kad kas nors gali nukopijuoti jūsų raktą ir padidinti naudojimą jūsų sąskaitoje. Google saugumo gairės rekomenduoja pridėti svetainės (HTTP nukreipimo) apribojimus, kuriuose išvardinti jūsų domenai, ir API apribojimus, kad raktas veiktų tik su naudojamomis API.

Serverio pusės paslaugų raktai – pavyzdžiui, tūkstančių adresų geokodavimas – turi būti atskiri raktai, laikomi serverio pusės paslaptyse, o ne puslapyje. Taip pat nustatykite biudžeto įspėjimus ar kvotas tiekėjo konsolėje, kad klaida netaptų didele sąskaita.

Geokodavimas: adresus paverskite koordinatėmis vieną kartą

Žemėlapiai rodo platumą ir ilgumą, o ne adresus. Adreso vertimas į koordinates vadinamas geokodavimu, ir daugelis tiekėjų už jį moka pagal užklausą. Efektyvus modelis:

1. Kai įrašas išsaugomas, serveryje geokoduokite jo adresą.
2. Išsaugokite platumą ir ilgumą duomenų bazėje.
3. Žemėlapis skaito išsaugotas koordinates; jis niekada negeokoduoja peržiūros metu.

Patikrinkite kiekvieno tiekėjo sąlygas, kiek laiko galite saugoti geokodavimo rezultatus; jos skiriasi.

Raginimų pavyzdžiai

Vienas įterptas žemėlapis:

Kontaktų puslapyje pridėk įterptą Google žemėlapį, rodantį mūsų adresą (12 High Street, Leeds), naudodamas Maps Embed API su raktu GOOGLE_MAPS_EMBED_KEY. Po juo pridėk nuorodą „Gauti kryptis“. Telefonuose padaryk visą plotį ir įkrauk atidėtai.

Interaktyvus skelbimų žemėlapis:

Pridėk platumą ir ilgumą prie skelbimų lentelės. Kai skelbimas sukuriamas arba pasikeičia jo adresas, serveryje jį geokoduok naudodamas raktą GEOCODING_API_KEY ir išsaugok koordinates. Puslapyje Browse rodyk žemėlapį su žymekliu kiekvienam skelbimui naudodamas Leaflet, su grupavimu, kai žymekliai persidengia. Paspaudus žymeklį rodyk pavadinimą, kainą ir nuorodą. Žemėlapis ir sąrašas turi naudoti tuos pačius filtrus.

„Netoliese“:

Pridėk mygtuką „Netoliese“, kuris paprašo lankytojo vietos ir rodo skelbimus per 10 km, rūšiuotus pagal atstumą. Jei jis atsisako vietos prieigos, leisk įvesti miestą.

Žingsnis po žingsnio

1. Pasirinkite žemėlapio tipą iš lentelės viršuje.
2. Sukurkite tiekėjo paskyrą ir projektą bei įjunkite tik reikalingas API.
3. Sukurkite raktus: naršyklės raktą, apribotą jūsų domenais (įskaitant peržiūros domeną kūrimo metu), ir, jei reikia, serverio raktą geokodavimui.
4. Saugokite raktus kaip paslaptis ir paprašykite savo kūrimo įrankio jais naudotis; naršyklės raktas vis tiek apribotas, nors galiausiai atsiduria puslapyje.
5. Saugokite koordinates kiekvienai vietai savo duomenų bazėje.
6. Sukurkite žemėlapį: žymekliai, iškylantys langeliai, grupavimas ir tinkamas numatytasis mastelis.
7. Derinkite su sąrašu. Vien žemėlapis sunkiai naudojamas telefone ir ekrano skaitytuvams. Rodykite tuos pačius rezultatus kaip sąrašą.
8. Nustatykite biudžeto įspėjimą tiekėjo konsolėje.
9. Publikuokite ir išbandykite tiesioginiame domene, nes nukreipimo apribojimai dažnai blokuoja žemėlapį, kol nepridedamas tiesioginis domenas.

Dažnos klaidos

• Neapriboti raktai. Bet kas gali juos panaudoti savo svetainėje.
• Geokodavimas kiekvienos peržiūros metu. Lėta ir brangu; geokoduokite vieną kartą išsaugodami.
• Pamirštas tiesioginis domenas raktų apribojimuose. Veikia peržiūroje, bet gamyboje – tuščias pilkas langelis.
• Maketai tik su žemėlapiu. Žymekliai be sąrašo nepatogūs mažuose ekranuose ir neprieinami.
• Šimtai žymeklių be grupavimo. Nesuskaitomi ir lėti.
• Trūkstamas šaltinio nurodymas. Dauguma žemėlapių ir plytelių tiekėjų to reikalauja, o jo paslėpimas pažeidžia jų sąlygas.
• Vietos prašymas puslapio įkrovimo metu. Prašykite tik tada, kai naudotojas paspaudžia „Netoliese“.

Kontrolinis sąrašas

• Užduočiai pasirinktas tinkamas žemėlapio tipas
• Naršyklės raktas apribotas jūsų domenais ir reikalingomis API
• Serverio pusės raktai laikomi paslaptyse
• Koordinatės išsaugotos duomenų bazėje, geokoduotos vieną kartą
• Rezultatai rodomi ir kaip sąrašas
• Grupavimas esant daugybei žymeklių
• Šaltinio nurodymas matomas
• Biudžeto įspėjimas nustatytas su tiekėju
• Išbandyta publikuotame domene ir telefone

Žemėlapių pridėjimas su Mythex

Mythex integruoto žemėlapių sprendimo nėra; naudojate savo tiekėjo raktą, pridedate jį kaip projekto paslaptį (arba įklijuojate, kai agentas parodo paslapčių kortelę) ir pokalbyje paprašote žemėlapio, kaip aprašyta Integruoti bet kokį API. Koordinates dedate į projekto duomenų bazę. Nepamirškite pridėti ir peržiūros, ir publikuoto domeno prie rakto svetainės apribojimų, o pakeitę paslaptis publikuokite dar kartą.

Žemėlapiai dažniausiai eina kartu su paieška ir skelbimais: žr. kaip pridėti paiešką prie programėlės, kaip sukurti katalogo svetainę ir kaip sukurti mažos įmonės svetainę.

Klausimai