13 Knjižnice JavaScript za ustvarjanje interaktivnih in prilagojenih zemljevidov

Pred tem smo ustvarili Google Map Maker in 10 drugih orodij, ki vam bodo pomagali pri izdelavi zemljevidov. Če pa namesto tega raje uporabljate knjižnice Javascript, smo dobili objavo za vas. Tu so knjižnice JS, ki jih lahko uporabite za prikaz posebnih oznak zemljevidov, risanje linij po meri ali celo prikaz pogovornega okna, ko premaknete ali kliknete določene točke na zemljevidu.

Prilagodite svoje zemljevide v želenem slogu - nekatere od njih je mogoče oblikovati s CSS - ali prilagodite zemljevid tako, da bo čim bolj interaktiven. Vir podatkov zemljevidov, odvisnosti in licenc za vsako knjižnico je vključen za vaše udobje.

Več o storitvi Hongkiat:

• Kako oblikovati Google Zemljevide
• Pridobivanje lokacije uporabnika z API-jem za geolokacijo HTML5
• Vizualizacija podatkov: 20+ uporabnih orodij in virov

GMaps

GMaps omogoča preprosto dodajanje in prilagajanje Google Zemljevidov. Poleg dodajanja zemljevida lahko na zemljevid vključite tudi nekaj stvari, kot so polilinije, ki so lahko uporabne za risanje poti, poseben nadzor v meniju in celo elemente HTML..

GMaps je združljiv z oblikovanimi podatki JSON, ki jih lahko uporabite za integracijo zemljevida z določeno aplikacijo, kot je Foursquare.

• Vir podatkov na zemljevidu: Google zemljevidi
• Odvisnosti: nobena
• Licenca: Licenca MIT

Tukaj

Na 5KB vam jHERE pokaže, da velikost ni pomembna; še vedno lahko zgradite zmogljiv interaktivni zemljevid s številnimi možnostmi prilagajanja. jHERE izvede vizualizacijo zemljevida iz zemljevida TUKAJ, ki je eden izmed najbolj priljubljenih ponudnikov zemljevidov za Windows Phone.

Knjižnico lahko razširite z novo funkcionalnostjo in za to knjižnico je razvitih nekaj razširitev, vključno z eno za dodajanje oblik, poti in označevalcev po meri..

• Vir podatkov na zemljevidu: HERE Zemljevidi
• Odvisnosti: jQuery ali ZeptoJS
• Licenca: Licenca MIT

Kartograf

Kartograf vsebuje dve datoteki, Kartograph.ph za ustvarjanje zemljevida v formatu SVG, in Kartograph.js za dodajanje interaktivnih elementov na vrh zemljevida. Ker je Kartograph.js zgrajen na vrhu Raphael.js, bo zemljevid lepo deloval do IE7. Oglejte si interaktivne predstavitve zemljevidov in ugotovite, kaj lahko naredi Kartograf.

• Vir podatkov na zemljevidu: Kartograf
• Odvisnosti: Kartograph.py, Raphael in jQuery
• Licenca: AGPL in LGPL

Mapael

jQuery Mapael omogoča ustvarjanje zemljevidov z elegantno vizualizacijo podatkov in interaktivnostjo. Na primer, lahko ustvarite zemljevid in določite vsako regijo na zemljevidu z različnimi barvami glede na regijo. Dodate lahko tudi opis orodij v regiji in podobno kot tudi upravljalnike dogodkov kliknite ali hover.

Zemljevid je zasnovan z namenom SEO z zagotavljanjem nadomestne vsebine za robote iskalnikov, ki ne morejo pajkati vsebine, ki jo je ustvaril JavaScript.

• Vir podatkov na zemljevidu: Raphael.js
• Odvisnosti: jQuery
• Licenca: Licenca MIT

D3js

D3.js je obsežna knjižnica JavaScript, ki bo vaše podatke oživila s pomočjo HTML, SVG in CSS. Uporaba D3 je precej raznolika, vključno z izgradnjo zelo interaktivnega zemljevida. Oglejte si zemljevid globalnega razvoja Svetovne banke in videli boste možnosti, kaj lahko gradite z D3.js.

• Vir podatkov na zemljevidu: D3.js
• Odvisnosti: nobena
• Licenca: Nedoločeno

Podatkovne mape

Če je izdelava zemljevida z D3.js izjemna, jo lahko uporabite Podatkovne mape. DataMaps je v bistvu D3.js plugin, ki je razvit posebej za izdelavo zemljevidov. Podeduje veliko zmožnosti D3.js, zato lahko z njo izdelate preproste ali zelo prilagojene zemljevide. Sem omenil, da je zemljevid odziven?

• Vir podatkov na zemljevidu: D3.js
• Odvisnosti: D3.js in TopoJSON
• Licenca: Licenca MIT

GeoChart

GeoChart je poenostavljen Google Zemljevid, ki namesto polnega zemljevida z drobnimi podrobnostmi prikaže regijo, oznake in besedilo. Zemljevid je ustvarjen v SVG-ju in ga je mogoče prilagoditi na več načinov, vključno s spreminjanjem barv regij, dodajanjem pojavnih in prilagojenih oznak zemljevidov..

• Vir podatkov na zemljevidu: Google zemljevidi
• Odvisnosti: nobena
• Licenca: Preberite Google Zemljevide TOS

Maplace

Maplace, vtičnik jQuery za ustvarjanje zemljevida prek API-ja vmesnika Google Maps v3. Maplace deluje v vseh brskalnikih, vključno z IE6. Torej, to je še en dober plugin vredno vaše pozornosti, če želite zgraditi zemljevid na najlažji možni način.

• Vir podatkov na zemljevidu: Google zemljevidi
• Odvisnosti: jQuery
• Licenca: Licenca MIT

Odličen

Odličen je JavaScript knjižnica, ki je razvita za ustvarjanje zemljevidov ZDA. Knjižnica je primerljivo lahka, saj lahko dodate interaktivne elemente na vrh ustvarjenih zemljevidov.

• Vir podatkov na zemljevidu: Zvest / SVG
• Odvisnosti: nobena
• Licenca: Licenca MIT

GeoComplete

GeoComplete je samostojna knjižnica JavaScript. Knjižnica bo skupaj z zemljevidom dodala vnosno polje, ki bo med tipkanjem prikazalo predloge mest, držav ali držav.

• Vir podatkov na zemljevidu: Google zemljevidi
• Odvisnosti: jQuery
• Licenca: Licenca MIT

Orodja za zemljevide

Orodja za zemljevide zagotavljajo intuitiven API za dodajanje Google Zemljevidov. Podpira nalaganje geoformatiranih podatkov JSON, kot so TopoJSON in GeoJSON, da prikaže zemljevid. Poleg tega lahko dodate animirane označevalce, za katere mislim, da bodo zemljevid bolj živahni, vstavite vsebino HTML s spremenljivkami ali ogradami ala Krmila.

• Vir podatkov na zemljevidu: Google zemljevidi
• Odvisnosti: GeoJSON / TopoJSON
• Licenca: Licenca MIT

OpenLayers

OpenLayers je visoko zmogljiv okvir odprtokodnega JavaScripta za izdelavo interaktivnih zemljevidov z uporabo različnih kartografskih storitev. Iz niza zemljevidov lahko izberete vir sloja zemljevida z uporabo ploščastega sloja ali vektorskega sloja.

OpenLayer prihaja iz mobilnega telefona, ki je primeren za izdelavo zemljevidov med napravami in brskalniki. CSS lahko uporabite za drugačen videz zemljevida. Za izvedbo zemljevida v spletu z uporabo OpenLayers-a je tu vadnica, ki vam bo pomagala.

• Vir podatkov na zemljevidu: OpenStreetMap
• Odvisnosti: nobena
• Licenca: Nedoločeno

Letak

Razvijalci so dali Letak osnovne funkcije za popolno delovanje, ohranjanje majhnosti, za mobilne naprave. Za posebne funkcije preprosto razširite letak z vtičniki. Letak ima večino spletnih zemljevidov, ki jih potrebujete: slojev ploščic, pojavnih oken, označevalcev in prostih vektorskih plasti, kot so polilinije, mnogokotniki, krogi ali pravokotniki. Prihaja z lepo privzeto modelov, čeprav lahko prilagodite slog z uporabo CSS3 z lahkoto.

Letak ima največ funkcij za interakcijo med uporabo za mobilne in namizne brskalnike.

• Vir podatkov na zemljevidu: OpenStreetMap
• Odvisnosti: nobena
• Licenca: Nedoločeno