Skip to content

Latest commit

 

History

History
476 lines (383 loc) · 9.86 KB

slides.md

File metadata and controls

476 lines (383 loc) · 9.86 KB
Raw
theme highlighter lineNumbers colorSchema drawings class title layout
default
shiki
true
light
persist
text-center text-black
Masterportal Webinar
start

Masterportal Webinar Logo

In wenigen Schritten zum eigenen Geoportal

terrestris und dataport am 30. Juni 2022

layout: two-cols-header

::title::

🗣️ Über terrestris

::left::

  • Open Source GIS aus Bonn seit 20 Jahren 🥳
  • 25 MitarbeiterInnen und 2 Geschäftsführer
  • Aufbau von Geodateninfrastrukturen und WebGIS
    • modular mit etablierten OS-Komponenten
    • Bspw. Berechtigungsmanagement
  • Präsent auf FOSSGIS und FOSS4G
  • Aktive Mitarbeit in vielen OS GIS Projekten
  • Geo-Consulting
  • Wartung und Support u.a. für
    • Masterportal, MapProxy, SHOGun, OL, GeoServer, MapServer, QGIS, Postgres, Mapfish

::right::

terrestris

[email protected]

twitter: terrestrisde

github/terrestris.de

--- layout: main ---

Was erwartet Sie?

  • 👥 Vorstellung der IP (Implementierungs­­partnerschaft)
  • 👨‍💻 Technischer Background
  • 🌍 Globale Konfiguration
  • ⚙️ Portalkonfiguration
  • 🛠 Werkzeuge
  • 🗺️ Anbindung von Services (Print, Suche)
  • 🪁 Addons
  • 🚀 Ausblick

layout: statement

👥Vorstellung der IP

layout: main

👨‍💻 Technischer Background

Vue.js Modernes Javascript Framework
Bootstrap Frontend Framework
Openlayers Webmapping API
Cesium Library for 3D Globes (WebGL basiert)

layout: main

👷‍♂️ Technischer Background - Architektur

--- layout: main ---

Applikationskontext

layout: two-cols-header

::title::

🌍 Globale Konfiguration

::left::

services.json

  • Zentrale Konfiguration für Layer
  • WMS, WFS, WMTS, SensorThings-API, GeoJSON u.a.
  • wird in der jeweiligen Portalkonfiguration config.js referenziert
  • Kann auch über einen API-Endpunkt generiert werden (z.B. Dienstemanager)

::right::

{
    "id" : "8",
    "name" : "Aerial View DOP 10",
    "url" : "https://geodienste.hamburg.de/HH_WMS_DOP10",
    "typ" : "WMS",
    "layers" : "1",
    "format" : "image/jpeg",
    "version" : "1.3.0",
    "singleTile" : false,
    "transparent" : true,
    "tilesize" : "512",
    "gutter" : "0",
    "minScale" : "0",
    "maxScale" : "1000000",
    "gfiAttributes" : "ignore",
    "layerAttritibuon" : "nicht vorhanden",
    "legend" : false
}

layout: two-cols-header

::title::

🌍 Globale Konfiguration

::left::

rest-services.json

  • Services, die nicht direkt für die Darstellung von Daten benötigt werden:
    • Print services (MapFish)
    • Metadata sources (CSW)
    • BKG geocoding service
    • Gazetteer URL
    • WPS

::right::

style.json

  • Styledefinitionen für Vektorlayer (Styling erfolgt im Client)
  {
    "styleId": "blue-point",
    "rules": [
      {
        "style":
          {
          "circleRadius" : 6,
          "circleStrokeColor": [51, 102, 255, 1],
          "circleStrokeWidth": 2,
          "circleFillColor": [51, 102, 255, 1]
          }
      }
    ]
  }

layout: two-cols-header

::title::

⚙️ Portalkonfiguration

::left::

config.js

  • Pfade zu Backends und weiteren Konfigurationsdateien
  • Projektionsdefinitionen (z.B. UTM32N, UTM33N)
  • Liste an Addons
  • Quickhelp
  • Footer
  • Mousehover
  • Sprachen
  • Blacklist für GFI-Attribute (z.B. geom, id)

::right::

const Config = {
    namedProjections: [
        ["EPSG:25832", "+title=ETRS89/UTM 32N +proj=utm +zone=32 +ellps=GRS80 +towgs84=0,0,0,0,0,0,0 +units=m +no_defs"]
    ],
    footer: {
        showVersion: true
    },
    quickHelp: {
        imgPath: "./resources/img/"
    },
    layerConf: "./resources/services-internet.json",
    restConf: "./resources/rest-services-internet.json",
    styleConf: "./resources/style_v3.json",
    scaleLine: true,
    mouseHover: {
      numFeaturesToShow: 2,
      infoText: "(weitere Objekte. Bitte zoomen.)"
    }
}

layout: two-cols-header

::title::

⚙️ Portalkonfiguration

::left::

config.json

  • Konfiguration der Portal-Oberfläche
  • Titel und Logo
  • Kartenelemente
  • Menüelemente
  • Werkzeuge und Addons
  • Suche
  • Themenbaum (Layertree)

::right::

	"Portalconfig": {
    "treeType": "light",
		"searchBar": {
			"komoot": {
        "minChars": 3,
        "serviceId": "11",
        "limit": 20,
        "lang": "de",
        "lat": 53.6,
        "lon": 10.0,
        "bbox": "9.6,53.3,10.4,53.8"
    },
      "visibleVector": {
		  "layerTypes": ["WFS"]
	  },
      "tree": {},
			"startZoomLevel": 9,
			"placeholder": "Suche nach: - Adresse - Aktiven WFS"
		}
	}

layout: statement

Live-Demo 🎮

layout: iframe-right url: https://viz.berlin.de/wp-content/plugins/masterportal-wordpress/public/portals/berlin_2_19/index.html?layerIds=WebatlasBrandenburg,EcoCounter&transparency=30,0&lng=de

SensorThings API

  • Datenfluss von IoT Sensoren
  • Beispiele: Verkehrszählungen, Mobilität, Luftmessnetzdaten
   {
      "id" : "999999",
      "name" : "Live - Charging locations",
      "typ" : "SensorThings",
      "version" : "1.0",
      "url" : "https://51.5.242.162/itsLGVhackathon",
      "intersect": true,
      "urlParameter" : {
         "root" : "Things",
         "filter" : "startswith(Things/name,'Charging')",
         "expand" : "Locations,Datastreams/Observations($orderby=phenomenonTime%20desc;$top=1)"
      }
      "mqttOptions" : {
        "host" : "https://localhost",
        "port": "1883"
      }

layout: iframe-right url: https://test.geoportal-hamburg.de/vectorTiles

VectorTiles

{
  "id": "UNIQUE_ID",
  "name": "Ein Vektortilelayername",
  "epsg": "EPSG:3857",
  "url": "https://example.com/3857/tile/{z}/{y}/{x}.pbf",
  "typ": "VectorTile",
  "vtStyles": [
    {
      "id": "STYLE_2",
      "name": "Nachtansicht",
      "url": "https://example.com/3857/resources/styles/night.json"
    }
  ]
}

Ausblick

  • Optimierung VectorTile Support in OL
  • OGC API Tiles (maps and vector tiles)

layout: two-cols-header

::title::

Featureliste (Auszug)

::left::

  • Strecke / Fläche messen
  • Zeichnen / Schreiben
  • Layerslider
  • Schrägluftbilder
  • Vergleichslisten
  • Koordinatenabfrage
  • Elastic Search
  • Informationsabfrage Metadaten
  • Informationen abfragen (Attribute) + Theming
  • Koordinatensuche
  • Komoot Photon
  • Auswahl speichern (Permalink)

::right::

  • Graph
  • Auswahl Vektordienstübergreifend
  • Mehrsprachigkeit
  • Buffer Analyse
  • Time Slider
  • Flurstückssuche
  • Layer Swipe
  • Aktive Themen durchsuchen
  • Routing

layout: two-cols-header

::title::

🪁 Addons

::left::

  • Vue.js Komponenten (früher Backbone)
  • Kommunikation mit den Core-Komponenten über Vuex (zentrales state management)
  • Beliebige, individuelle Tools oder GFI-Themes
  • Erweiterung von
    • Kartenfunktionen
    • Suchen
    • Layout

::right::

Beispiele:

  • BORIS
  • Einwohnerabfrage
  • backgroundSwitcher
  • Erweiterte Suche (Detailsuche)
  • scaleLineCustom
  • mpJsApi (Javascript API, zum Steuern des Masterportals von außen)
  • Generische Import und Export-Tools
    • Einstieg von verschiedenen Komponenten (Suche, Tree, Menü)
    • SHAPE, GPKG, GeoJSON
    • Styling beim Import von Vektordaten

layout: main

🚀 Ausblick

  • Verknüpfung Masterportal Anwendung mit Fachanwendungen
  • Verbesserung der Einbindung in CMS
  • Erweiterung der Flurstückssuche
  • Daten-Analyse und Präsentation
  • Verbesserung der Barrierearmut
  • Großformatiges Plotten
  • ...

layout: main

Hilfreiche Links

layout: statement

Vielen Dank

für das Interesse 🤝

Fragen gerne jetzt oder an:
[email protected], [email protected]