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 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 2

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

Krok 3

Pomocou balíka folium vytvoríme a zobrazíme mapu.

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 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.

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:

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.