Skip to content

Vergleiche bis zu 4 Karten gleichzeitig - Compare up to 4 maps at once

License

Notifications You must be signed in to change notification settings

jimmyhenne/quattromap

 
 

Repository files navigation

QuattroMap

GitHub CI status License

Kreiseigene Kartenanwendung, die vor allem die Außendiensttätigkeiten unterstützen kann.

Unter https://kreis-viersen.github.io/quattromap/ ist eine Demo des Tools von jedem internetfähigen Gerät, wie Tablet, Smartphone, Laptop und PC, erreichbar.

Mit Hilfe der Anwendung können bis zu 4 verschiedene Karten mit gleichem Kartenausschnitt gleichzeitig dargestellt werden. Über die Schaltfläche in der linken unteren Ecke gelangt man zu den Einstellungen der Kartenfenster. Zur Auswahl der Kartenhintergründe stehen z. B. Luftbilder, Liegenschaftskataster, geplanteGebäude oder OpenStreetMap zur Verfügung.

In den Kartenfenstern können auch Überlagerungen (Overlays) benutzt werden, um bspw. Luftbilder und geplante Gebäude übereinander zu legen.

Am rechten Bildschirmrand gibt es eine Suchfunktion (Mapbox GL Geocoder Control: https://github.com/mapbox/mapbox-gl-geocoder) sowie die Möglichkeit den Kartenausschnitt und den eigenen Standort über die Standortbestimmung des Geräts anzuzeigen (Standortbestimmung muss im Gerät eingeschaltet bzw. erlaubt sein). Dazu gibt es dort eine Schaltfläche, um die Anwendung im Vollbild anzuzeigen. Ein Klick auf das Kompass-Symbol richtet die Karte(n) wieder nach Norden aus.

Messwerkzeuge

Sobald nur eine Karte angezeigt wird, stehen Messwerkzeuge zur Verfügung:

  • LineString: zum Messen eine Entfernung in Metern
  • Polygon: zum Messen einer Fläche in Quadratmetern

Einfach das gewünschte Werkzeug auswählen, den LineString oder das Polygon auf der Karte zeichen und mit einem Klick auf den letzten Stützpunkt abschließen:

Aktuell verfügbare Dienste

Layer

Name Art URL Dienste Layer
Geobasis NRW
NRW Luftbild Farbe WMS https://www.wms.nrw.de/geobasis/wms_nw_dop?SERVICE=WMS&VERSION=1.3.0&REQUEST=GetCapabilities nw_dop_rgb
NRW vDOP Farbe WMS https://www.wms.nrw.de/geobasis/wms_nw_vdop?SERVICE=WMS&VERSION=1.3.0&REQUEST=GetCapabilities nw_vdop_rgb
NRW ALKIS FLURSTÜCKE WMS https://www.wms.nrw.de/geobasis/wms_nw_alkis?SERVICE=WMS&VERSION=1.3.0&REQUEST=GetCapabilities adv_alkis_flurstuecke
NRW Amtliche Basiskarte (ABK) WMS https://www.wms.nrw.de/geobasis/wms_nw_abk?SERVICE=WMS&VERSION=1.3.0&REQUEST=GetCapabilities WMS_NW_ABK
NRW Alkis TN WMS https://www.wms.nrw.de/geobasis/wms_nw_alkis?SERVICE=WMS&VERSION=1.3.0&REQUEST=GetCapabilities adv_alkis_tatsaechliche_nutzung
NRW Schummerung WMS https://www.wms.nrw.de/geobasis/wms_nw_dgm-schummerung?SERVICE=WMS&VERSION=1.3.0&REQUEST=GetCapabilities nw_dgm-schummerung_pan
NRW DTK WMS https://www.wms.nrw.de/geobasis/wms_nw_dtk?SERVICE=WMS&VERSION=1.3.0&REQUEST=GetCapabilities nw_dtk_col
NRW TDOM WMS https://www.wms.nrw.de/geobasis/wms_nw_tdom?SERVICE=WMS&VERSION=1.3.0&REQUEST=GetCapabilities nw_tdom
OpenStreetMap
OSM Mapnik XYZ Tiles https://www.openstreetmap.org
RVR
RVR Luftbild Farbe WMS https://geodaten.metropoleruhr.de/dop/dop?SERVICE=WMS&VERSION=1.3.0&REQUEST=GetCapabilities dop
KRZN-Dienste
Kreis Viersen ALKIS WMS https://gdi-niederrhein-geodienste.de/flurkarte_verb_sammeldienst/service?SERVICE=WMS&VERSION=1.3.0&REQUEST=GetCapabilities FlurkarteAdV_Viersen
Stadt Krefeld ALKIS WMS https://gdi-niederrhein-geodienste.de/flurkarte_verb_sammeldienst/service?SERVICE=WMS&VERSION=1.3.0&REQUEST=GetCapabilities FlurkarteAdV_Krefeld
Kreis Wesel ALKIS WMS https://gdi-niederrhein-geodienste.de/flurkarte_verb_sammeldienst/service?SERVICE=WMS&VERSION=1.3.0&REQUEST=GetCapabilities FlurkarteAdV_Wesel
Kreis Kleve ALKIS WMS https://gdi-niederrhein-geodienste.de/flurkarte_verb_sammeldienst/service?SERVICE=WMS&VERSION=1.3.0&REQUEST=GetCapabilities FlurkarteAdV_Kleve
Stadt Bottrop ALKIS WMS https://gdi-niederrhein-geodienste.de/flurkarte_verb_sammeldienst/service?SERVICE=WMS&VERSION=1.3.0&REQUEST=GetCapabilities Flurkarte_Bottrop
Kreis Viersen ALKIS light WMS https://geoservices.krzn.de/security-proxy/services/wms_kvie_alkis_light?SERVICE=WMS&VERSION=1.3.0&REQUEST=GetCapabilities nutzungsarten, flurstuecke, gebaeude, lagebezeichnungen
Kreis Viersen Geplante Gebäude WMS https://geoservices.krzn.de/security-proxy/services/wms_kvie_geplgeb?SERVICE=WMS&VERSION=1.3.0&REQUEST=GetCapabilities kvie_geplgeb
Nationaal Georegister (NL)
NL Luftbild Farbe WMS https://geodata.nationaalgeoregister.nl/luchtfoto/rgb/wms?SERVICE=WMS&VERSION=1.3.0&REQUEST=GetCapabilities Actueel_ortho25
Kreis Warendorf
Kreis Warendorf ALKIS WMS https://www.kreis-warendorf.de/arcgis/service2?SERVICE=WMS&VERSION=1.3.0&REQUEST=GetCapabilities alkis_lieka
Kreis Warendorf ABK 1:5000 WMS https://www.kreis-warendorf.de/arcgis/service2?SERVICE=WMS&VERSION=1.3.0&REQUEST=GetCapabilities abk5000
Kreis Steinfurt
Kreis Steinfurt ALKIS WMS https://gis.kreis-steinfurt.de/arcgis13/services/Geobasisdaten/Geobasisdaten_Kreissuebersichtskarte_DTK_farbe/MapServer/WMSServer?SERVICE=WMS&VERSION=1.3.0&REQUEST=GetCapabilities 0
Kreis Steinfurt ABK WMS https://gis.kreis-steinfurt.de/arcgis13/services/Geobasisdaten/Geobasisdaten_ABK_farbe/MapServer/WMSServer?SERVICE=WMS&VERSION=1.3.0&REQUEST=GetCapabilities 0

Overlays

Zusätzlich zu den unter Layer gelisteten Diensten sind als Overlay verfügbar:

Name Art URL Dienste Layer
Geobasis NRW
NRW TDOM Metadaten WMS https://www.wms.nrw.de/geobasis/wms_nw_tdom?SERVICE=WMS&VERSION=1.3.0&REQUEST=GetCapabilities nw_tdom_info
NRW Luftbild Overlay WMS https://www.wms.nrw.de/geobasis/wms_nw_dop_overlay?SERVICE=WMS&VERSION=1.3.0&REQUEST=GetCapabilities WMS_NW_DOP_OVERLAY
NRW LINFOS WMS https://www.wms.nrw.de/umwelt/linfos?SERVICE=WMS&VERSION=1.3.0&REQUEST=GetCapabilities Naturschutzgebiete, Landschaftsschutzgebiet

Konfiguration

Über die config.json können einige Einstellungen der QuattroMap vorgenommen werden.

Parameter Erklärung Beispiel
"center" Gibt die Zentrumskoordinate des Kartenfensters beim Starten an. Angabe geographisch mit Längen- und Breitenangabe in EPSG 4326. "center": [6.391263, 51.258812]
"zoom" Definiert die Zoomstufe beim Start. Wertebereich: 0 (fern) - 22 (nah) "zoom": 16
"maps" Optionale Angabe über die Anzahl der Kartenfenster. Mögliche Werte: 1, 2, 3, 4; Standardwert: 4 "maps": 2
"crosshair" Optionale Definition der Fadenkreuzfarbe. Mögliche Werte: black, red, orange, yellow, green, blue, pink; Standardwert: black "crosshair": "red"
"map_x": {"layer": layername} Optional: "overlay": layername, "overlay_opacity": opacity-value, } Voreinstellung der dargestellten Dienste des Kartenfensters x (1-4) beim Starten der QuattroMap. layer enthält einen Namen eines Dienstes, die unter "layer" definiert sind. overlay enthält einen Namen eines Dienstes, der als Abdeckungslayer dient und muss nur angegeben werden, wenn ein Abdeckungslayer verwendet werden soll. overlay_opacity definiert die Deckkraft des Abdeckungslayers. Mögliche Werte: 0 (transparent) - 1 (opak); Standardwert: 0.5 "map_1": {"layer": "NRW Luftbild Farbe", "overlay": "NRW Schummerung", "overlay_opacity": 0.4}
"layer": [ .. ] Enthält die Definitionen der wählbaren Dienste im Dropdown Menü
"name" Name des Dienstes, der im Dropdown Menü und beim Klick auf den Info-Button erscheint. "name": "NRW Alkis TN"
"attribution" Attribution zur Beschreibung der verwendeten Dienste, die über den Info-Button dargestellt wird. HTML-Tags können verwendet werden. "attribution": "Land NRW (2021) Deutschland – Zero – Version 2.0 (<a target='_blank' rel='noopener noreferrer' href='https://www.govdata.de/dl-de/zero-2-0'>www.govdata.de/dl-de/zero-2-0</a>)"
"url" URL des WMS 1.3.0 Dienstes oder OpenStreetMap XYZ-Tiles "url": "https://www.wms.nrw.de/geobasis/wms_nw_alkis"
"layer" Darzustellende Layer des Dienstes. Mehrere Layer werden mit Komma getrennt. "layer": "nutzungsarten,flurstuecke"
"format" Abzurufendes Rasterformat (png oder jpeg) der Kacheln. Da png Transparenz ermöglicht, ist png zu empfehlen. Jedoch können nicht alle Dienste png liefern. "format": "png"
"category" Begriff zur Kategorisierung der Dienste im Dropdown-Menü. "category": "GeoBasis NRW"
"onlyOverlay" Mit diesem optionalen Parameter lässt sich der entsprechende Dienst nur als Overlay verwenden. "onlyOverlay": true
"style" Optionaler Parameter zur Auswahl eines bestimmten Stils. Stile können von Diensten angeboten werden. "style": "Farbe"

Develop

# clone the repository
git clone https://github.com/kreis-viersen/quattromap/
cd quattromap

Install the deps, start the dev server and open the web browser on http://localhost:8080/.

# install dependencies
npm install
# start dev server
npm start

The build process will watch for changes to the filesystem, rebuild and autoreload quattroMap. However note this from the webpack-dev-server docs:

webpack uses the file system to get notified of file changes. In some cases this does not work. For example, when using Network File System (NFS). Vagrant also has a lot of problems with this. In these cases, use polling. (snippet source)

# build the app
npm run build

Once the build is finished, you'll find it at dist/.

# publish files to a gh-pages branch on GitHub
npm run deploy

Search

For the search functionality https://github.com/mapbox/mapbox-gl-geocoder is used.

For your own quattroMap please use your own access token: https://docs.mapbox.com/help/how-mapbox-works/access-tokens/.

About

Vergleiche bis zu 4 Karten gleichzeitig - Compare up to 4 maps at once

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • JavaScript 67.5%
  • HTML 18.1%
  • CSS 14.4%