QGIS Web Client 2 (QWC2)

QGIS Web Client 2 (QWC2) ist ein modularer, responsiver Web Client für QGIS Server, basierend auf dem ReactJS Framework und OpenLayers.
QWC2 ist eine Javascript Applikation, die in produktiven Umgebungen in kompilierter und optimierter Form als „Applikationsbundle“ installiert wird.
  • QWC2 teilt sich in zwei Repositories:
    1. Die QWC2 Kernkomponenten für alle QWC2 Applikationen: https://github.com/qgis/qwc2/
    2. Die QWC2 Demo-Application, ein Beispiel: https://github.com/qgis/qwc2-demo-app. Dieses Repository enthält die anwenderspezifischen Konfigurationen der Kernkomponenten sowie ggf. weitere eigens angepasste Komponenten.
  • Um mit QWC2 arbeiten zu können, wird eine Kompilationsumgebung aus git, node and yarn benötigt.

QWC kompilieren

QWC2-doc, QWC2-doc_de

  1. Download und Installation von git, node and yarn
  2. lokales Arbeitsverzeichnis anlegen
  3. dort mittels (RMT) Git Bash here
    1. das Quellcode-Repository klonen:
      $ git clone --recursive https://github.com/qgis/qwc2-demo-app.git
    2. notwendige abhängige Komponenten installieren:
      $ cd qwc2-demo-app
      $ yarn install
    3. und schließlich QWC zu einem deploybaren Applikationsbundle im Unterordner prod kompilieren:
      $ yarn run prod

Deployment

  • Um die QWC2 in produktiven Umgebungen zu installieren, ist diese gesamte Struktur (s.u.) an einen vom Webserver zugänglichen Ort (DocumentRoot) zu kopieren.
    • Falls QWC2 in einem Unterordner einer Website installiert werden soll, müssen die assetsPath und translationsPath Einstellungen in der config.json Datei entsprechend angepasst werden.
    • Die Datei index.html ist der Eingangspunkt der Applikation.
    • Die kompilierte QWC2 Applikation (im Unterordner prod) hat folgende Struktur:
      ├── assets/ 
      │   ├── css/ 
      │   │   └── qwc2.css 
      │   ├── img/ 
      │   │   ├── <Bilder, Ikonen>
      │   │   ├── genmapthumbs/ 
      │   │   │   └── <generierte Kartenvorschaubilder>
      │   │   └── mapthumbs/ 
      │   │       └── <Kartenvorschaubilder>
      │   └── templates/
      │       └── legendprint.html
      ├── dist/ 
      │   └── <Javascript Module>
      ├── translations/ 
      │   └── <Übersetzungen>
      ├── config.json
      ├── index.html 
      └── themes.json

Generieren von themes.json

  • :!: Die Generierung der Themenkonfigurationsdatei themes.json erfolgt schon automatisch beim kompilieren und zwar anhand der Konfigurationsdateien themesConfig.json und config.json.
  • themes.json kann aber auch separat (z.B. aufgrund von Einstellungsanpassungen) generiert werden, mittels Git Bash:
    $ yarn run themesconfig

    Dabei wird die Konfigurationsdatei themesConfig.json eingelesen und mit den Eigenschaften aus dem WMS-Dienst vervollständigt. Das Resultat wird in themes.json geschrieben, die anschließend im Applikationsbundle hinterlegt bzw. ausgetauscht werden muss. (→ QWC2-doc. QWC2-doc_de)

Konfiguration von QWC2

Applikationskonfiguration

Mittels config.json werden verschiedene Verhaltensaspekte von QWC2 konfiguriert, unter anderem welche Komponenten in der Desktop- bzw. Mobil-Version aktiv sind, welche Einträge in Menü und Werkzeugleiste erscheinen, wo sich Ressourcendateien befinden, usw. → QWC2-doc, QWC2-doc_de

Themenkonfiguration

:!: Jedes „Thema“ („theme“) im QWC entspricht einem QGIS Projekt, welches via QGIS Server als WMS publiziert wird. Die Schritte für die Themenkonfiguration sind folgende:

  1. Anpassen und Publizieren der QGIS ProjekteQWC2-doc, QWC2-doc_de. Siehe auch QGIS 3.4 Dokumentation → QGIS Server / Projektkonfiguration
  2. Einträge für Themen und Hintergrundkarten in themesConfig.json erstellen → QWC2-doc, QWC2-doc_de
  3. Generieren von themes.json (s.o.).

besondere Hinweise

  • FIXME :?: (wie) einen bestimmten QWC2-branch von GitHub für stabile, produktive Anwendungsszenarien einstellen?
  • :!: Hinweis zur Erzeugung der themes.json aus der QWC Demo App in restriktiven Netzwerken: Es kann sein, dass trotz Proxy-Konfiguration von Yarn und npm die in themeConfig.json angegenen OWS-Server nicht erreicht werden und damit die Kompilation abbricht und das Applikationbundle nicht korrekt erzeugt wird. Wenn man also diese unerreichbaren Dienste aus der Konfiguration entfernt, funktioniert es auch hinter jeder Firewall.
  • FIXME oder mit dem Python-Skript themesConfig.py