TopPlusOpen - geodatenzentrum.de · TopPlusOpen 5 Es öffnet sich das Fenster Layer eines WM(T)S-Servers hinzufügen. Über die Schaltfläche Neu kann die URL eingebeben werden. Abbildung

TopPlusOpen

Einbindung des Dienstes

TopPlusOpen

2

Inhaltsverzeichnis

1 Grundlegendes ................................................................................................................... 3

1.1 Kurzbeschreibung ......................................................................................................... 3

1.2 Web-Adressen ............................................................................................................... 3

2 Einbindung in Geoinformationssysteme ............................................................................. 4

2.1 Einbindung des WM(T)S in QGIS .................................................................................. 4

2.2 Einbindung des WMS in ArcGIS Pro .............................................................................. 9

3 Einbindung in eigene Webseite ........................................................................................ 13

3.1 Einbindung des WMTS mit OpenLayers ...................................................................... 13

3.2 Einbindung des WMS mittels Leaflet ........................................................................... 15

4 Kontakt ............................................................................................................................. 17

TopPlusOpen

3

1 Grundlegendes

1.1 Kurzbeschreibung

Die TopPlusOpen ist ein Dienst des Bundesamtes für Kartographie und Geodäsie (BKG), der eine

durchgängige Webkarte, komplett auf Basis freier und offener Datenquellen, für jeden kostenlos

anbietet.

Damit aus diesem Dienst, dem Web Map Service (WMS), eine Karte entstehen kann, muss dieser

von einer geeigneten Anwendung angesprochen und geladen werden. In diesem Dokument

werden beispielhaft die Einbindung in die zwei gängigsten Geoinformationssysteme (GIS) und

zwei gängigsten JavaScript-Bibliotheken gezeigt.

Um eine klassische Papierkarte zu erstellen, eignen sich GIS-Lösungen. Die verbreitetsten

Programme sind das kommerzielle ArcGIS und das offene QGIS.

Damit die Karte in einem Browser, z.B. auf der eigenen Webseite, dargestellt werden kann,

benötigt man eine geeignete JavaScript Bibliothek. Üblich sind hier die kostenlosen und offenen

Lösungen OpenLayers und Leaflet.

1.2 Web-Adressen

Den aktuellen Stand, die Datenquellen und die Nutzungsbedingungen der TopPlusOpen findet

man unter:

Freie Daten und Dienste des BKG - TopPlus-Web-Open

Die URLs des Web Map Service (WMS) und des Web Map Tile Service (WMTS) lauten:

http://sgx.geodatenzentrum.de/wms_topplus_web_open?

http://sgx.geodatenzentrum.de/wmts_topplus_web_open/1.0.0/WMTSCapabilities.xml

http://www.geodatenzentrum.de/geodaten/gdz?l=down_topplus_open

TopPlusOpen

4

2 Einbindung in Geoinformationssysteme

Geoinformationssysteme sind Programme und Programmpakete, die eine Vielzahl von Funktionen

zur Verarbeitung von Geodaten bieten. Sie lassen sich gut zur Kartenerstellung nutzen und

beherrschen die Einbindung von sogenannten Web Map Services (WMS) und Web Map Tile

Services (WMTS). Dies wird hier näher beschrieben. Für weitere Funktionen ist eine Vertiefung in

die Webseiten und die Handbücher der Software empfehlenswert.

2.1 Einbindung des WM(T)S in QGIS

Nach dem Start von QGIS erstellt man ein neues Projekt über den Menüpunkt Projekt – Neu oder

die Schaltfläche in der Projektwerkzeugleiste.

Abbildung 1 QGIS-Fenster, neues Projekt

Nun erscheint das leere Kartenfenster. Auf der linken Seite ist das Layerfenster , das die geladenen

Geodaten namentlich auflistet. Da ein neues Projekt erstellt wurde, ist dieses noch leer.

Rechts vom Layerfenster befindet sich das Kartenfenster. In diesem Bereich werden die

geladenen Geodaten grafisch dargestellt.

Um nun die TopPlusOpen in QGIS als Karte zu laden, muss dem Programm der Ort des Web-

Dienstes mitgeteilt werden Über die Schaltfläche

kann ein WMS oder WMTS eingebunden werden. Alternativ über das Menü Layer – Layer

hinzufügen – WMS-/WMTS-Layer hinzufügen.

TopPlusOpen

5

Es öffnet sich das Fenster Layer eines WM(T)S-Servers hinzufügen. Über die Schaltfläche Neu

kann die URL eingebeben werden.

Abbildung 2 QGIS - WMS hinzufügen

TopPlusOpen

6

Name kann beliebig vergeben werden, es empfiehlt sich den Namen des Dienstes, hier:

TopPlusOpen zu verwenden.

Unter URL gibt man die die URL des WMS ein. Hier:


Da die TopPlusOpen jedem zur Verfügung gestellt wird, ist eine Eingabe von Benutzernamen

und Kennwort nicht erforderlich. Mit OK bestätigt man den neuen WMS.

Abbildung 3 QGIS - Verbindung zum WMS

TopPlusOpen

7

Zurück im vorherigen Fenster erscheint die TopPlusOpen nun in dem Dropdown-Menü. Über die

Schaltfläche Verbinden wird eine Verbindung zum Server hergestellt. Es erscheinen die

verschiedenen Varianten mit einer Beschreibung in der Spalte Zusammenfassung.

Abbildung 4 QGIS – Auswahl des Layers

Hier wählt man eine Variante aus und fügt sie über die Schaltfläche Hinzufügen hinzu. Die

TopPlusOpen wird darauf im Kartenfenster geladen. Im Layerfenster erscheint die dazugehörige

Legende.

TopPlusOpen

8

Die TopPlusOpen wird darauf im Kartenfenster geladen. Im Layerfenster erscheint die

dazugehörige Legende.

Abbildung 5 QGIS - geladene TopPlusOpen

TopPlusOpen

9

2.2 Einbindung des WMS in ArcGIS Pro

Um einen WMS in ArcGIS Pro hinzuzufügen, erstellt man zunächst ein neues Projekt und in diesem

eine neue Karte.

Abbildung 6 ArcGIS Pro – Fenster, neues Projekt

Auf der Registerkarte Einfügen kann man über Verbindungen, dann Neuer WMS-Server ein

Fenster öffnen

Abbildung 7 ArcGIS Pro – Verbindungen, neuer WMS-Server

TopPlusOpen

10

In das die URL des Dienstes unter Server-URL eingegeben werden kann. Für die TopPlusOpen

lautet sie:


Abbildung 8 ArcGIS Pro – WMS-Server Verbindung hinzufügen

Da die TopPlusOpen jedem zur Verfügung gestellt wird, ist eine Eingabe von Benutzernamen und

Kennwort nicht erforderlich.

Mit OK bestätigt man den neuen WMS.

http://sgx.geodatenzentrum.de/wms_topplus_web_open

TopPlusOpen

11

Im Katalog von ArcGIS Pro erscheint nun der neu eingegebene WMS unter Server – WMS

TopPlusOpen und kann per Drag & Drop in das Projekt eingefügt werden.

Abbildung 9 ArcGIS Pro – Katalog, geladener Dienst mit Layern

TopPlusOpen

12

Die TopPlusOpen wird darauf im Kartenfenster geladen. Im Layerfenster erscheint die

dazugehörige Legende.

Abbildung 10 ArcGIS Pro – geladene TopPlusOpen mit Legende

TopPlusOpen

13

3 Einbindung in eigene Webseite

Die folgenden zwei Methoden zeigen beispielhaft anhand der gängigsten zwei JavaScript -

Bibliotheken, wie die TopPlusOpen in eine eigene Seite eingefügt werden kann. Die TopPlusOpen

kann dann als Hintergrundkarte verwendet werden. Im Vordergrund können dann z.B. eigene

Points of Interest eingeblendet werden. Beide Bibliotheken bieten zusätzliche Funktionen, auf die

hier aber nicht näher eingegangen werden soll. Die Webseiten der nachfolgend vorgestellten

Bibliotheken beinhalten interessante Anwendungsbeispiele.

3.1 Einbindung des WMTS mit OpenLayers

Über folgenden Code kann schnell eine Webseite mit interaktiver Karte realisiert werden. Die

Bibliothek OpenLayers und der Dienst TopPlusOpen werden aus dem Internet geladen. Speichert

man den Code in einer HTML-Datei, ist er ohne weiteres in einem Web-Browser aufrufbar. Die

Karte lässt sich mit der Maus verschieben, hat Kontrollelemente für Zoom und für weitere

Informationen und funktioniert auch auf mobilen Endgeräten.

Abbildung 11 OpenLayers - TopPlusOpen im Browser

TopPlusOpen

14

<!DOCTYPE html>

<html>

<head>

<title>WMTS Layer from Capabilities</title>

<link rel="stylesheet" href="https://openlayers.org/en/v4.6.4/css/ol.css" type="text/css">



<script

src="https://cdn.polyfill.io/v2/polyfill.min.js?features=requestAnimationFrame,Element.prototype.

classList,URL"></script>

<script src="https://openlayers.org/en/v4.6.4/build/ol.js"></script>

</head>

<body>

<div id="map" class="map"></div>

<script>

var parser = new ol.format.WMTSCapabilities();

var map;

fetch('http://sgx.geodatenzentrum.de/wmts_topplus_web_open/1.0.0/WMTSCapabilities.xml').then(func

tion(response) {

return response.text();

}).then(function(text) {

var result = parser.read(text);

var options = ol.source.WMTS.optionsFromCapabilities(result, {

layer: 'web',

matrixSet: 'EPSG:3857'

});

options.attributions = [

new ol.Attribution({

html: '<a href="http://bkg.bund.de">Bundesamt für Kartographie und

Geodäsie</a> 2017, <a

href="http://sg.geodatenzentrum.de/web_public/Datenquellen_TopPlus_Open.pdf">Datenquellen</a>'

})

];

map = new ol.Map({

layers: [

new ol.layer.Tile({

opacity: 1,

source: new ol.source.WMTS(options)

})

],

target: 'map',

controls: ol.control.defaults({

attributionOptions: {

collapsible: false

}

}),

view: new ol.View({

center: [3500000, 6000000],

zoom: 4

})

});

});

</script>

</body>

</html>

Abbildung 12 OpenLayers - Code in einer HTML-Datei

TopPlusOpen

15

3.2 Einbindung des WMS mittels Leaflet

Über folgenden Code kann schnell eine Webseite mit interaktiver Karte realisiert werden. Die

Bibliothek Leaflet und der Dienst TopPlusOpen werden aus dem Internet geladen. Speichert man

den Code in einer HTML-Datei, ist er ohne weiteres in einem Web-Browser aufrufbar. Die Karte

lässt sich mit der Maus verschieben, hat Kontrollelemente für den Zoom und funktioniert auch auf

mobilen Endgeräten.

Abbildung 13 Leaflet – TopPlusOpen im Browser

TopPlusOpen

16

<!DOCTYPE html>

<html>

<head>

<title>TopPlus-Web-Open in Leaflet</title>

<meta charset="utf-8" />

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css"

crossorigin=""/>

<script src="https://unpkg.com/[email protected]/dist/leaflet.js" crossorigin=""></script>

</head>

<body>

<div id="mapid" style="width: 600px; height: 400px;"></div>

<script>

var map = L.map('mapid').setView([50.0, 8.6], 4);

var wmsLayer = L.tileLayer.wms('http://sgx.geodatenzentrum.de/wms_topplus_web_open', {

layers: 'web',

format: 'image/png',

transparent: true,

attribution: '&copy Bundesamt für Kartographie und Geodäsie 2017, <a href=

"http://sg.geodatenzentrum.de/web_public/Datenquellen_TopPlus_Open.pdf">Datenquellen</a>'

}).addTo(map);

</script>

</body>

</html>

Abbildung 14 Leaflet - Code in einer HTML-Datei

TopPlusOpen

17

4 Kontakt

Bundesamt für Kartographie und Geodäsie

Dienstleistungszentrum

Karl-Rothe-Straße 10-14

04105 Leipzig

E-Mail: [email protected]

Tel.: 0341/5634-333

Fax: 0341/5634-415

© 2018

mailto:[email protected]

Documents

TopPlusOpen - geodatenzentrum.de · TopPlusOpen 5 Es öffnet sich das Fenster Layer eines WM(T)S-Servers hinzufügen. Über die Schaltfläche Neu kann die URL eingebeben werden. Abbildung