DE:OSM-map as screenshot

From OpenStreetMap Wiki
Jump to: navigation, search
Verfügbare Sprachen — OSM-map as screenshot
· Afrikaans · Alemannisch · aragonés · asturianu · azərbaycanca · Bahasa Indonesia · Bahasa Melayu · Bân-lâm-gú · Basa Jawa · Baso Minangkabau · bosanski · brezhoneg · català · čeština · dansk · Deutsch · eesti · English · español · Esperanto · estremeñu · euskara · français · Frysk · Gaeilge · Gàidhlig · galego · Hausa · hrvatski · Igbo · interlingua · Interlingue · isiXhosa · isiZulu · íslenska · italiano · Kiswahili · Kreyòl ayisyen · kréyòl gwadloupéyen · Kurdî · latviešu · Lëtzebuergesch · lietuvių · magyar · Malagasy · Malti · Nederlands · Nedersaksies · norsk bokmål · norsk nynorsk · occitan · Oromoo · oʻzbekcha/ўзбекча · Plattdüütsch · polski · português · português do Brasil · română · shqip · slovenčina · slovenščina · Soomaaliga · suomi · svenska · Tiếng Việt · Türkçe · Vahcuengh · vèneto · Wolof · Yorùbá · Zazaki · српски / srpski · беларуская · български · қазақша · македонски · монгол · русский · тоҷикӣ · українська · Ελληνικά · Հայերեն · ქართული · नेपाली · मराठी · हिन्दी · অসমীয়া · বাংলা · ਪੰਜਾਬੀ · ગુજરાતી · ଓଡ଼ିଆ · தமிழ் · తెలుగు · ಕನ್ನಡ · മലയാളം · සිංහල · ไทย · မြန်မာဘာသာ · ລາວ · ភាសាខ្មែរ · ⵜⴰⵎⴰⵣⵉⵖⵜ · አማርኛ · 한국어 · 日本語 · 中文(简体)‎ · 吴语 · 粵語 · 中文(繁體)‎ · ייִדיש · עברית · اردو · العربية · پښتو · سنڌي · فارسی · ދިވެހިބަސް

Die Karte von Openstreetmap wird auf einer Website am einfachsten als Bild (Screenshot) eingebunden. Dieses Bild wird mit einem Link zu Openstreetmap verknüpft. Mit Klick auf das Bild landet man dann direkt in der zoombaren und verschiebbaren Weltkarte. Dort kann man mit einem Marker gezielt eine Position anzeigen.

Screenshot erstellen

Wähle in der Karte von Openstreetmap einen Ausschnitt, auf dem das was Du auf dem Bild zeigen willst gut zu sehen ist.

  1. erstelle mit <Druck> (oben rechts auf der Tastatur) eine Bildschirmkopie
  2. öffne in einem Bildbearbeitungsprogramm (z.B. Gimp, Photoshop oder ganz einfach Paint) eine neue Datei
    und füge mit <Strg-c> die eben erstellte Bildschirmkopie aus der Zwischenablage ein
  3. schneide mit dem Ausschneide-Werkzeug einen passenden Ausschnitt aus
  4. hier kann nun eine Hervorhebung eingefügt werden, beispielsweise ein Ortsname unterstrichen, ein roter Kreis um das Ziel, eine Fläche eingefärbt, je nach Bearbeitungsprogramm.
  5. Bild (am Besten als .png-Datei) speichern

Bild in Website einbinden

Angezeigt wird das Bild auf der Website durch folgenden HTML-Code:

<img alt="Bildbeschreibungs-Text" src="Bild-Dateiname" border="0">

Positioniert wird das Bild durch CSS (oder eine HTML-Tabelle). Bei XHTML steht direkt vor der schließenden spitzen Klammer ein Schrägstrich.

Bild mit Link zu OpenStreetMap verknüpfen

Erstelle einen Link, der direkt die Weltkarte von OpenStreetMap öffnet und dort einen genauen Kartenausschnitt mit Marker anzeigt.

Verknüpfe das Bild auf der Website mit dem eben erstellten Permalink:

<a href="OSM-Permalink"><img alt="Bildbeschreibungs-Text" src="Bild-Dateiname" border="0"></a>

Bei XHTML steht vor der schließenden spitzen Klammer des img-Tags ein Schrägstrich.

Siehe auch