Slippymap mit OpenLayers und Overpass

Liebe Spezialisten,

2008 entstand dieses HowTo, wie man eine Slippymap mit OL in eine Website einbindet. Funktioniert.

Nun möchte ich das HowTo gern ergänzen mit einem HowTo zum Ausführen einer Overpass-Abfrage und Einbinden der Ergebnisse in die Karte.

Das könnte man in einem weiteren Tab “2. Layer” beschreinben:

Dort könnte man folgendes darstellen:

  1. wie erstelle ich eine passende Overpass-Abfrage
  2. wo speichere ich die Ergebnisse? in welchem Format
  3. wie zeige ich die Ergebnisse als Layer
    (Code für Copy und Paste)

Beispiel:

  • Grenze einer bestimmten Gemeinde
  • alle Trinkwasserbrunnen, Sitzbänke, Restaurants, …
  • alle Wanderwege

Ich teste das grad mit der Gemeinde Simmelsdorf und den Sitzbänken

Das zugehörige Overpass-Turbo-Ergebnis:

/*
This has been generated by the overpass-turbo wizard.
The original search was:
“amenity= bench in Simmelsdorf”
*/
[out:json][timeout:25];
// fetch area “Simmelsdorf” to search in
{{geocodeArea:Simmelsdorf}}->.searchArea;
// gather results
(
  // query part for: “boundary=administrative and name=Simmelsdorf”
  relation["boundary"="administrative"]["name"="Simmelsdorf"];
  // query part for: “amenity=bench”
  node["amenity"="bench"](area.searchArea);
  way["amenity"="bench"](area.searchArea);
  relation["amenity"="bench"](area.searchArea);
);
// print results
out body;
>;
out skel qt; 

Unklar ist mir:

  • wie man das alles nun in ein layer.js schreibt,
  • das Popup hübsch gestaltet,
  • und alles in das HTML einbaut.

Vielleicht können wir das als Beispiel im Tab “2. Layer” detailliert beschreiben?

Mit herzlichem Gruss,
Markus

Hi,
Ich hab hier leider nur begrenzt Internetzugang deswegen muss ich dir auswendig antworten.

Du musst in OL einen neuen Vektor Lager anlegen. Der hat eine Option um die Daten über einen Aufruf von einer externen URL einzulesen und über die Proxy Option kannst du ihm das Format geojson als Eingangsformat angeben.
Die externe url ist zb. eine php Datei in der du die Overpass api mit dem query ansprichst.
Stell das ausgabeformat vom query auf json, das kann php mit dem Befehl json_decode in einen array/Objekt umwandeln. Dann musst du nur mehr das Objekt ins geojson Format umwandeln und mit echo zurückliefernen.

Die Objekte liegen dann als Features im vectorlayer und können über JS ganz normal angesprochen werden. Für popups oder andere Dinge.

Hoffe der weg hat dir ein wenig geholfen
LG tom

Edit: http://dev.openlayers.org/releases/OpenLayers-2.13.1/examples/geojson-reprojected.js
Schau dir das mal an. Wie gesagt die URL kann auch ein Script sein welches geojson zurück liefert

Hallo Tom, herzlichen Dank für Deine schnelle Antwort! Das Abfrageergebnis habe ich erfolgreich als GeoJSON exportiert und gespeichert.
Den Rest habe ich leider nicht verstanden. Bin kein Programmierer, sondern will nur das HowTo im Wiki ergänzen bzw. aktualisieren (und dabei gleich testen). Gruss, Markus

Hi Markus,
Gern geschehen. Bin im Moment leider nur mit Tablet in einer etwas Internetfreien Gegend unterwegs.
In 2 Wochen kann ich dir ein kommentiertes Bsp zukommen lassen wenn ich wieder am Heimrechner bin.
Wenn du das geojson schon hast dann passt das OL Bsp. Eh gut. Einfach den URL teil durch deine Datei ersetzen. Eventuell den Projektionsteil noch anpassen und mal schauen was rauskommt.
LG tom