Hallo,
ich habe nach dieser Anleitung
die unveränderten Dateien auf einen Webserver geladen; die Startseite habe ich osm.html genannt, da es index.html bereits gibt.
Rufe ich nun die url/osm.html auf, kommt eine weiße (leere) Seite. Zum Test habe ich eine osm2.html mit etwas Text erstellt: Rufe ich url/osm2.html, kommt der definierte Text.
Meine Fragen:
Danke, Michael
http://umap.openstreetmap.fr/de/map/beispiel-kuchenbude_510921#18/51.00933/13.65824
so etwa? Über teilen → iframe - HTLM für die Webseite?
Danke, aber ich muss eine txt-Datei wie im Beispiel verwenden. Außerdem möchte ich verstehen, warum bei mir keine Karte sondern nur eine leere Seite angeźeigt wird.
Wenn ich den html Code aus https://wiki.openstreetmap.org/wiki/DE:OpenLayers_Simple_Example in eine lokale Datei kopiere und diese mit Firefox öffne, erscheint die erwartete Karte (Zentrum von Berlin).
Event. liegt das Problem bei Deinem Web-Server.
Erscheinen Fehlermeldungen auf der Browserconsole? (F12, Reiter Console)
Und falls Du noch ganz am Anfang stehst: Bis Du Dir bewußt daß sich Leaflet zum Quasi-Standard für Kartenseiten entwickelt hat? Bedeutend einfacher zu verstehen und zu verwenden, OpenLayers wird von den meisten Kartenwebsites nicht mehr benutzt.
Danke @Nop, Browserconsole ist ein guter Tipp!
Folgendes wird gemeldet, sagt mir allerdings gar nichts:
1 Anfrage für Zugriff auf Cookies oder Speicher für "https://www.openlayers.org/api/OpenLayers.js" wurde blockiert, weil alle Anfragen für Speicherzugriff für nicht direkt aufgerufene Websites (Drittanbieter) blockiert werden und das Blockieren von Seitenelementen aktiviert ist.
2 Das Cookie "__cfduid=d34e0840543d01a682cc40d90ae9515091603090237; expires=Wed, 18-Nov-20 06:50:37 GMT; path=/; domain=.openlayers.org; HttpOnly; SameSite=Lax; Secure" wurde als Drittanbieter abgelehnt. OpenLayers.js
3 <script>-Quell-URI ist in diesem Dokument nicht erlaubt: "https://www.openlayers.org/api/OpenLayers.js". EigeneDomain.de:3:1
4 Das Cookie "" wurde als Drittanbieter abgelehnt. OpenLayers.js
5 Das Cookie "__cfduid=d34e0840543d01a682cc40d90ae9515091603090237; expires=Wed, 18-Nov-20 06:50:37 GMT; path=/; domain=.openlayers.org; HttpOnly; SameSite=Lax; Secure" wurde als Drittanbieter abgelehnt. OpenLayers.js
6 Uncaught ReferenceError: OpenLayers is not defined
<anonymous> https://EigeneDomain.de/:5
Weitere Informationen: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Errors/Not_defined?utm_source=mozilla&utm_medium=firefox-console-errors&utm_campaign=default
EigeneDomain.de:5:5
7 Die Zeichenkodierung des HTML-Dokuments wurde nicht deklariert. Das Dokument wird in manchen Browser-Konfigurationen mit verstümmeltem Text dargestellt, wenn das Dokument Zeichen außerhalb des US-ASCII-Bereichs enthält. Die Zeichenkodierung der Seite muss im Dokument oder Transferprotokoll deklariert werden. EigeneDomain.de
Die Meldungen 1…5 sind gelb, Nummer 6 und 7 rot hinterlegt.
Zu Leaflet: Von leaflet kenne ich bisher nicht mehr als den Namen; und ja, ich stehe bei meiner Aufgabe ganz am Anfang.
Ich möchte ein Werkzeug zur Qualitätssicherung; hierzu habe ich ein BASH-Script, mit dem check_date für definierbare Regionen abgefragt wird. Das Script liefert eine HTML-Liste mit Node-Type, Name, Adresse etc. und einen klickbaren Link zu JOSM. Außerdem erstellt es eine .txt-Datei zur (rot / grün) Darstellung der Fundstellen; Beispiel:
point title description icon
45.4025531,12.9640938 Bushaltestelle shelter<br><br><br><br>2015-01-01<br>xy101<br><a href=http://127.0.0.1:8111/load_and_zoom?left=11.8630938&right=11.8650938&top=48.5035531&bottom=48.5015531&select=node4994001674&addtags=check_date=2020-10-18 target=dummyiframe>Add</a> lastcheck in JOSM<br><a href=http://127.0.0.1:8111/load_and_zoom?left=11.8630938&right=11.8650938&top=48.5035531&bottom=48.5015531&select=node4994001674 target=dummyiframe>View</a> in JOSM<iframe style='display:none; visibility:hidden;' name=dummyiframe src=/> Bullet_CircleRed.svg
45.5917897,12.8658985 shelter<br><br><br><br>2015-01-01<br>abc<br><a href=http://127.0.0.1:8111/load_and_zoom?left=11.9648985&right=11.9668985&top=48.4927897&bottom=48.4907897&select=node2398276697&addtags=check_date=2020-10-18 target=dummyiframe>Add</a> lastcheck in JOSM<br><a href=http://127.0.0.1:8111/load_and_zoom?left=11.9648985&right=11.9668985&top=48.4927897&bottom=48.4907897&select=node2398276697 target=dummyiframe>View</a> in JOSM<iframe style='display:none; visibility:hidden;' name=dummyiframe src=/> Bullet_CircleGreen.svg
Ich bin dankbar für jede Hilfe, so wie Du es beschreibst wäre Leaflet wohl passender …
Leaflet habe ich jetzt mit diesem Beispiel erfolgreich umgesetzt; ich denke, das wird mein Weg!
Wo finde ich jetzt eine Anleitung, die Koordinaten aus der .txt-Datei mit verschiedenfarbigen Marker und JOSM-Link in die Karte zu zaubern?
@MichaelFS,
du hast in deinem Browser den Schutz etwas zu hoch geschraubt.
Bei fx99 und bei mir funktioniert der code, bei Ansicht der Browserconsole wird auch über cookies gemoppert aber dennoch ausgeführt.
Die .txt Datei war unter openlayers2 mal ein Standardformat.
Ich benutze diese Format auch in den Folgeversionen, es ist eine csv-Lesung und Auswertung.
Zu diesem Standard gehört die Auflistung nach lat und lon (statt point). Unter Auslassung deiner iframe-Festlegungen kann ich die Datei direkt auswerten (Marker auf der Karte, Popup mit Link)
lat lon title description dummy icon
45.4025531 12.9640938 Bushaltestelle shelter<br><br><br><br>2015-01-01<br>xy101<br><a href=http://127.0.0.1:8111/load_and_zoom?left=11.8630938&right=11.8650938&top=48.5035531&bottom=48.5015531&select=node4994001674&addtags=check_date=2020-10-18 target=dummyiframe>Add</a> lastcheck in JOSM<br><a href=http://127.0.0.1:8111/load_and_zoom?left=11.8630938&right=11.8650938&top=48.5035531&bottom=48.5015531&select=node4994001674 target=dummyiframe>View</a> in JOSM <iframe style='display:none; visibility:hidden;' name=dummyiframe src=/> m/icons/marker-red.png
45.5917897 12.8658985 shelter<br><br><br><br>2015-01-01<br>abc<br><a href=http://127.0.0.1:8111/load_and_zoom?left=11.9648985&right=11.9668985&top=48.4927897&bottom=48.4907897&select=node2398276697&addtags=check_date=2020-10-18 target=dummyiframe>Add</a> lastcheck in JOSM<br><a href=http://127.0.0.1:8111/load_and_zoom?left=11.9648985&right=11.9668985&top=48.4927897&bottom=48.4907897&select=node2398276697 target=dummyiframe>View</a> in JOSM <iframe style='display:none; visibility:hidden;' name=dummyiframe src=/> ../images/mm_40_red.gif
Zu deinem offensichtlichen Vorhaben
Für das besitzende Verkehrsunternehmen mag eine regelmäßige Kontrolle von Wartehäuschen sinnvoll sein.
Bei osm ist das Thema doch etwas komplexer als rot/grün, es gibt nach public_transport kein shelter=no als Eigenschaft.
Danke axelr,
Mag sein, allerdings habe ich Firefox mit deaktivierten Add-Ons gestarte, identisches Verhalten, keine Anzeige der Karte, leere Seite.
Die Beispieldaten habe ich “anonymisiert”, daher sind node-Namen und Koordinaten nicht “richtig”.
Ich würde gerne Leaflet verwenden, es scheint die aktuellere Lösung zu sein und funktioniert erst einmal. Eine überschaubare Anleitung zu ersten Schritten ist sehr willkommen.
Ich ändere die Überschrift in Leaflet (vormals OpenLayers) Anwendung.
Hallo zusammen,
da ich auch gerade einem Problem mit Openlayer6 nachjage eine Frage bezüglich Nichtdarstellung der Karte.
Mit welchen Endgeräten tritt das Problem auf? Bei meiner Anwendung, die mit OL 6.3.1 erstellt habe, kommt es auch zu dem Phaenomen, dass auf manchen iPhones/iPots mit die Karte nicht angezeigt wird.
Gruß hike39
Ich habe eine recht ähnliche Anwendung. Ich habe Dir mal einen relevanten Codeschnipsel rausgezogen. (Ich nutze im Textfile ‘#’ für den Zeilenumbruch und ‘|’ als Trennzeichen)
// create map first
// poi layer
var pois = L.featureGroup().addTo(map);
// show map
loadPOILayer();
function loadPOILayer() {
pois.clearLayers();
var url = '/textfile';
var xmlHttp = new XMLHttpRequest();
xmlHttp.onload = function () {
var lines = this.responseText.split('#');
for (var i = 0; i < lines.length; i++) {
var parts = lines[i].split('|');
if( parts.length < 6 )
break;
var iconId = parseInt( parts[2], 10 );
var lat = parseFloat( parts[5] );
var lon = parseFloat( parts[6] );
var latlon = L.latLng( lat, lon );
var marker = L.marker( latlon, { icon: poiIcons[ iconId ], title: parts[0] } );
marker.addTo( pois );
}
}
xmlHttp.open("GET", url, true);
xmlHttp.send();
Hoffe das hilft Dir weiter.
Vielen Dank @Nop,
leider gelingt es mir nicht, diesen Code mit dem HTML aus diesem Beispiel zu verbinden.