Přeskočit obsah

Webová kartografie

Tento povinně-volitelný předmět seznamuje se základy fungování a vytváření mapových aplikací ve webovém prostředí.

Začíná se seznámením s jazykem JavaScript a jeho možnostmi, přičemž je zmíněno fungování webových stránek a serverů, problematika DNS a domén a hostování webového obsahu. Mapové výstupy jsou pak vytvářeny užitím dvou metod – pomocí open-source mapové knihovny (využíváme Leaflet) a pomocí API rozhraní pokročilého kartografického cloudu (využíváme ArcGIS Online).

Jako účastníci kurzu se naučíte naprogramovat mapové aplikace využívající širokou škálu funkcionality, od rastrových a vektorových podkladových vrstev, přes stylování, tvorbu pop-upů, grafů a tematických výstupů po propojení mapy s grafikou či dalším obsahem. Pomocí ArcGIS API for Javascript si rozšíříte znalosti o tvorbě webových mapových aplikací v prostředí Esri, kde tento předmět navazuje na základy probírané v Kartografii 3.

Naučíte se

  • základy HTML, CSS a JavaScriptu

  • vyvíjet interaktivní webové mapové aplikace

  • využívat open-source mapové knihovny jako třeba Leaflet či OpenLayers

  • vizualizovat geoprostorová data na webu

  • pochopit fungování webových serverů

  • vytvořit interaktivní infografiku a propojit jí s mapou

  • sdílet data prostřednictvím webu (systém ArcGIS Online, webové mapové aplikace)

  • publikovat webové mapové aplikace s využití open-source softwaru QGIS

Doporučená literatura

Přednášky

jsou spíše formou workshopu a bezprostředně předcházejí cvičením, s nimiž se mnohdy prolínají

Ing. Tomáš Janata, Ph.D. | Ing. František Mužík

  1. Motivace k webové kartografii, úvod. Představení prostředí a technik. Přístupy k tvorbě webového obsahu. Webový server, typy serverů. Hosting
  2. Webový server – konfigurace. DNS, propojení obsahu s doménou. Základy JavaScript – datové typy, proměnné. Funkce, pole, řetězce, moderní operátory, cykly. DevTools, konzole, debug, responsivita.
  3. Základy JavaScript – DOM, asynchronní přenos, události, objektové typy. JSON, odkazování do souborů a načítání ze souborů.
  4. Mapové knihovny – Leaflet, OpenLayers, MapTiler. Leaflet – základní informace. Leaflet – mapový objekt, symbolika, prostorové dotazování, pop-up. Mapové elementy a rozdíly oproti konvenční kartografii.
  5. Tvorba pokročilejších aplikací v Leaflet
  6. Vstupní a výstupní formáty souborů. GeoJSON, souborové databáze, GeoPackage. Vektorové a rastrové dlaždice
  7. Javascriptové knihovny a prostředí pro tvorbu map. D3JS.
  8. Serverové fungování, nastavení, širší vztahy webového mapování. Apache, IIS
  9. Základy ArcGIS JavaScript API. Práce s WebMap
  10. ArcGIS JavaScript API – pokročilé možnosti. Feature Collection
  11. Ladění a škálování aplikací. Další API prostředí – CARTO.db, Mapbox aj. MapTiler, OSM

Cvičení

Ing. Tomáš Janata, Ph.D. | Ing. František Mužík

  1. Úloha 1 – Základ HTML. Tvorba webové formy životopisu v prostředí Glitch
  2. Základy práce s CSS. Základy JavaScriptu
  3. Úloha 2 – VS Code. Mapová aplikace v prostředí Leaflet
  4. GeoJSON. Tvorba kartogramu v Leaflet
  5. Úloha 2A – Knihovna D3.js
  6. Propojení Leaflet a D3.js. Kartodiagram
  7. Windows server (IIS) – konfigurace vlastního prostoru
  8. Úloha 3– Základy ArcGIS JavaScript API. Práce s WebMap. Mapová aplikace pomocí ArcGIS API
  9. Pokročilejší práce s ArcGIS JavaScript API
  10. Finalizace aplikace pomocí ArcGIS JavaScript API
  11. Úloha 4 – Jednoduchá aplikace pomocí GISQuick