Ako vytvoriť interaktívnu mapu v 5 krokoch (PyCon SK 2022)

Konferencia PyCon SK 2022, ktorá sa konala v Bratislave, je každoročné stretnutie komunity využívajúcej a vyvíjajúcej Python. Organizujú ju...
Napísal Lukáš January 5, 2023

Konferencia PyCon SK 2022, ktorá sa konala v Bratislave, je každoročné stretnutie komunity využívajúcej a vyvíjajúcej Python. Organizujú ju dobrovoľníci a dobrovoľníčky z občianskeho združenia SPy o.z. zameraného na šírenie jazyka Python a ďalších open sourcových technológií a myšlienok.

Aj tento rok bol nabitý zaujímavými prednáškami a workshopmi, ktoré pritiahli množstvo nadšencov Python-u. V tomto článku predstavíme tému, ktorá nás zaujala svojou jednoduchosťou, rýchlosťou implementácie a úžitkom, ktorý môže priniesť.

Reč je o prednáške Set up an interactive map in browser in a few steps, ktorú prezentoval pán Vojta Filipec. Čo sme sa v nej dozvedeli?

  • Ako vytvoriť interaktívnu, ľahko zdieľateľnú mapu
  • Ako na nej zobraziť body záujmu, tzv. POIs (Points of interest)
  • Nastavenie farby, veľkosti a tvaru POIs na mape
  • Zobrazenie pop-up okna s detailnými informáciami o POI

Krok 1

Použijeme OpenStreetMap na stiahnutie informácií o polohe všetkých knižníc na Slovensku. Krok 1

Krok 2

Transformáciami upravíme dáta do požadovaného tvaru. Kompletný kód nájdete na tomto linku Krok 2

Krok 3

Pomocou balíka folium vytvoríme a zobrazíme mapu. Krok 3_1 Krok 3_2

Krok 4

Do mapy pridáme body záujmu - POIs, ktorým môžeme definovať farbu, napríklad podľa určitej podmienky, ako je to uvedené v príklade na githube. Krok 4

Krok 5

V poslednom kroku si nastavíme pop-up okno, ktoré sa zobrazí po kliknutí na POI. Definujeme si funkciu, ktorá nám pop-up vytvorí a nastavíme ju ako parameter pri vytváraní POI. Krok 5_1 Krok 5_2

A je to! Na mape sme si zobrazili POIs, nastavili farbu POI na základe podmienky a vytvorili pop-up, ktorý sa zobrazí po kliknutí naň. A takto vyzerá finálny výsledok: Vysledok

Výsledok je možné ďalej konfigurovať, ako napríklad zmeniť podkladovú mapu, alebo použiť rôzne ikony namiesto krúžkov, ktoré označujú POI. Ak vás táto možnosť vytvárania mapy zaujala, neváhajte si pozrieť túto prednášku, ktorá je dostupná na YouTube.

Company name

Pri akomkoľvek zadaní a akejkoľvek požiadavke klienta sa pozeráme ďalej a chceme urobiť pre Vás viac ako by možno iným stačilo.

Kontaktná adresa

Adaptiware, spol. s r.o.
Južná trieda 8
04001 Košice
Slovenská republika

+421 905 724 771

© 2013 - 2024 - Adaptiware, spol. s r.o.