Liebe Profis, ich möchte gern OSM auf unserer offiziellen Gemeinde-Website nutzen. Dazu habe ich eine Testanwendung und eine Wiki-Seite geschrieben. Aktuelle Fragen: - zu jedem Marker einen eigenen Popup-Text anzeigen - Popup erst nach Klick auf Icon anzeigen - Linie aus GPX in Layer anzeigen - Marker aus Liste in Layer einbinden - Layer menügesteuert ein/aus-schalten - Gemeindegrenze aus GIF nach GPX extrahieren - Gemeindegrenze in OSM hochladen und anzeigen (ggf. über Layer?) - verschiedene Icons als Marker (Farbe, Form, Grösse) Du bist herzlich willkommen! Ich freue mich über Unterstützung, Ideen und Lösungen. Im Wiki, im Forum, per Mail oder wie auch immer. Im Wiki werde ich alle Fragen und Lösungen und den Code dokumentieren. (HTML, CSS, JS gibt es bereits…) Wenn die Website funktioniert, soll das Wiki allen Interessierten als Anleitung dienen… Gruss, Markus
Hi Markus, das Projekt finde ich toll, bin momentan aber leider unter Zeitdruck. Zum Thema POIs kann ich Dir bei Gelegenheit und Interesse meinen Code senden. Mit Linien habe ich noch nicht experimentiert :-(. Bastele selbst gerade an so einer Lösung, will sie aber auf Datenbankgriundlage erstellen und kommen nicht an meinen Provider. Viele Grüße - Peter
Hallo Peter,
Danke für die Blumen! Leider bin ich kein erfahrener Programmierer und kann auch mit englischen Texten nur bedingt etwas anfangen. Weil das vielen anderen sicher auch so geht, habe ich parallel zu meinen “Gehversuchen” mitgeholfen, eine Seite über OSM in Website einbinden auch für Laien nachvollziehbar in Deutsch zu übersetzen. Damit kann ich bereits erfolgreich Punkte auf dem Layer darstellen. Nun möchte ich die Gemeindegrenze gern als Linie deutlich hervorheben oder die Fläche der Gemeinde transparent einfärben. Dazu müsste ich einigen Inhalt von Openlayers Track example"irgendwie" in meine bisherigen Codeseiten einbauen. Aber was genau und wie und mit welchen Parametern? Die Gemeindegrenze habe ich als OSM/GPX vorliegen. Weil wahrscheinlich viele vor ähnlichen Fragen stehen, habe ich begonnen, das Projekt zu dokumentieren OSM in Website für Gemeinde Vielleicht hast Du ja noch Ideen, wie ich bei meiner DoDo-Liste weiterkomme? Ich fände es super, wenn Du mich ein bisschen unterstützen könntest!
gern!
Sehr interessant! Beim Projekt “OpenSeaMap” benötige ich auch eine DB… Mit herzlichem Gruss, Markus +49-9155-1715
So wie ich das Track-Example verstanden habe müsstest du einfach nur die GPX.js kopieren und mit
in deine HTML im head einbinden. Danach fügst du einfach diese Zeile dort ein, wo bei dir auch die anderen Layer erzeugt werden:
und aus
machst du
Dann sollte es eigentlich funktionieren, wenn ich alles richtig verstanden habe…
Hallöle, hier mal ein OSM-Beispiel mit Openlayers und MySQL-DB www.battefeld.com/lageplan/index.html Viele Grüße - Peter
Hallo Markus, Zur Gemeinde Grenze, ja genau wie TEL0000 schreibt funktioniert es. Ich habe mir erlaubt dies direkt in die Seite: http://wiki.openstreetmap.org/index.php/De:OSM_in_Website_f%FCr_Gemeinde einzubauen. Achtung mit dem Pfad hast Du alles im gleichen Pfad /osm/ oder nicht. Weil in der HTML Datei referenzierst du mit …/osm/OSM-Karte.css z.b. auf die .ccs Datei. Viel Spass Zapfen
Hallo Markus, alles angekommen? Viele Grüße - Peter
Hallo Peter, herzlichen Dank für Deine Post! Ich hänge grad noch an meiner Datei für die Gemeindegrenze, die ich erst mal in die OSM-DB einpflegen will. Hochgeladen finde ich nun dort doppelte Grenzlinien - die alten ungenauen und meine genauen - und stehe jetzt vor der Aufgabe, diese zu verschmelzen. Ich habe: - eine Datei mit der genauen Gemeindegrenze als Polygon - die genauen Koordinaten der “Dreiländerecken” (also wo eine weitere Grenze abgeht) - die in OSM bereits vorhandenen ungenauen Gemeinde- und Kreisgrenzen (teilweise identisch) Nun müsste ich: 1. in die Datei die Dreiländerecken einfügen 2. in der Datei den way an den Dreiländerecken in einzelne ways aufteilen 3. die Datei in JOSM öffnen 4. die in OSM bereits vorhandenen Grenzen in JOSM laden 5. in JOSM für die jeweiligen Teilstücke die schlechteren durch die besseren ersetzen 6. in JOSM den neuen Linien die Attribute und Relationen zuordnen 7. die neue Grenze nach OSM hochladen Und da stehe ich grad ziemlich auf dem Schlauch… ad 1: ich habe die genaue Grenze als OSM und als GPX. Welche der beiden muss ich bearbeiten? Wie /wo füge ich die Dreiländereck-Koordinaten ein? ad 4: wie lade ich aus OSM nur einzelne Linien (die Grenzen) herunter? ad 5: dazu habe ich ein HowTo “Grenze zeichnen” begonnen. Ergänzungen/Berichtigungen sich erwünscht! Gruss, Markus
Hallo ! also nachdem ich jetzt 2 Stunden daran herumgebastelt habe, versuche ich lieber hier hilfe zu bekommen. Ich finde die Anleitung absolut unübersichtlich - sorry. Bin zwar nicht der “große Programmierer”, aber habe trotzdem einige kenntnisse … jedoch bei diesem Projekt weiß ich langsam nichtmal mehr wo ich anfangen soll. Ich will einfach nur eine große Übersichtskarte (in meinem fall Niedersachsen-gesamt) haben, auf der ich diverse Marker einbinden kann, die dann einen kleinen Popup text haben. Das ganze soll dann auf einer Webseite eingebunden werden. Mehr nicht. Also übersichtskarte > Zoom-bar > Marker. Geht das nicht irgendwie ? Wär schön wenn mir da jemand helfen könnte. Gern - aber nicht unbedingt notwendig - würde ich dann auch noch bei den Markern Straßen und Gebäude einzeichnen (von Privatgrundstücken). Aber das ist nicht so wichtig.
Ich oute mich jetzt mal. 
Wo müssen welche Parameter angepasst werden. SO bekomme ich eine glatt-weise Seite! Georg
Bei welcher Anleitung bist du? Bei welchem Schritt hakt es? Bei dem OpenLayers Marker Example muss nichts angepasst werden. Das ganze in eine Html Datei kopieren und bei mir kommt eine wunderschöne Karte. Oder reden wir grade aneinander vorbei? Gruß Martin
Hallo Martin, ich habe “deinen” Link gemeint. So wie es dort steht, die ganze Seite (den Quelltext) kopiert in eine neue leere eingefügt, gespeichert, aufgerufen und… alles weis. Georg
Hallo Georg das ist in der Tat komisch. Was passiert wenn du http://mulimuli.de/osm/test2.html aufrufst ? ebenfalls eine weiße Seite? Gruß Martin
Nein diese Seite funktioniert, Karte und Marker sind vorhanden. Wahrscheinlich muß ich das Procedre einfach nochmal machen. Stutzig macht mich nur das keine Fehlermeldung einscheint…
Hi Hobbynavigator,
haste jetzt schon rausgefunden, wie man eine Karte mit Markern erstellt und die popups erst beim Anklicken öffnen kann?
Mir will es nicht gelingen.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de-de">
<head>
<title>Map | Beispiel </title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<meta http-equiv="content-script-type" content="text/javascript" />
<meta http-equiv="content-style-type" content="text/css" />
<meta http-equiv="content-language" content="de" />
<meta name="author" content="" />
<link rel="stylesheet" type="text/css" href="map.css">
<!--[if IE]>
<link rel="stylesheet" type="text/css" href="ie_map.css">
<![endif]-->
<script type="text/javascript" src="http://www.openlayers.org/api/OpenLayers.js"></script>
<script type="text/javascript" src="http://www.openstreetmap.org/openlayers/OpenStreetMap.js"></script>
<script type="text/javascript" src="js/tom.js"></script>
<script type="text/javascript">
//<![CDATA[
var map;
var layer_mapnik;
var layer_tah;
var layer_markers;
function drawmap() {
// Popup und Popuptext mit evtl. Grafik
var popuptext1="<font color=\"black\"><b>Tischtennisplatte <br> Kirche St. Georg<br>frei zugaenglich</b><p><img src=\"test.jpg\" width=\"0\" height=\"0\"></p></font>";
var popuptext2="<font color=\"black\"><b>Tischtennisplatte <br> Schule<br>nicht frei zugaenglich</b><p><img src=\"test.jpg\" width=\"0\" height=\"0\"></p></font>";
OpenLayers.Lang.setCode('de');
map = new OpenLayers.Map('map', {
projection: new OpenLayers.Projection("EPSG:900913"),
displayProjection: new OpenLayers.Projection("EPSG:4326"),
controls: [
new OpenLayers.Control.MouseDefaults(),
new OpenLayers.Control.LayerSwitcher(),
new OpenLayers.Control.PanZoomBar()],
maxExtent:
new OpenLayers.Bounds(-20037508.34,-20037508.34,20037508.34,20037508.34),
numZoomLevels: 19,
maxResolution: 156543.0399,
units: 'm'
});
layer_mapnik = new OpenLayers.Layer.OSM.Mapnik("Mapnik");
layerTah = new OpenLayers.Layer.OSM.Osmarender("Osmarender");
layer_markers = new OpenLayers.Layer.Markers("Address", { projection: new OpenLayers.Projection("EPSG:4326"),
visibility: true, displayInLayerSwitcher: false });
map.addLayers([layer_mapnik, layerTah, layer_markers]);
map.setCenter(new OpenLayers.LonLat(10.0115483,53.5545683).transform(new OpenLayers.Projection("EPSG:4326"),
new OpenLayers.Projection("EPSG:900913")), 16); map.addLayer(new OpenLayers.Layer.Markers());
// Position des Markers
addMarker(layer_markers, 10.007563, 53.556556, "<font color=\"black\"><b>Tischtennisplatte <br> Kirche St. Georg<br>frei zugaenglich</b><p><img src=\"test.jpg\" width=\"0\" height=\"0\"></p></font>");
addMarker (layer_markers, 10.010872, 53.556301,popuptext2);
}
//]]>
</script>
</head>
<body onload=drawmap();>
<div id="header">
<div id="content">Tischtennisplatten St. Georg</div>
<div id="osm">Karte von <a href="http://www.openstreetmap.org"
title="www.openstreetmap.org">openstreetmap.org</a></div>
</div>
<div id="map">
</div>
</body>
</html>
Ich habe es noch nicht weiter versucht… 
Georg
Was genau funktioniert nicht? Die Popups der Marker solltene eigentlich erst beim Anklicken aufgehen. Vielleicht hilft dir ja auch Easymap.
Danke, easymap kannte ich noch gar nicht. Ist ja ganz “easy” 