Interaktive Karten erstellen

Aus Wulfen-Wiki
Wechseln zu: Navigation, Suche

Im Wulfen-Wiki wurde eine Erweiterung zur Nutzung von Google Maps installiert. Damit lassen sich interaktive Karten erstellen. Darauf können Punkte, Pfade (Strecken) und Flächen gesetzt werden und gleichzeitig Artikel verlinkt werden.

Beispielkarte:

<googlemap version="0.9" lat="51.728517" lon="7.030392"> 51.728198, 7.030735, Barkenberger See Barkenberger See

  • Test Wiki-Syntax

[51.715915, 7.005758, Gewerbegebiet Köhl 6#99758BC5 51.72203, 7.02507 51.735108, 7.041721, Napoleonsweg 51.740636, 7.047901 51.750733, 7.066269 6#7F3FF30E (#BB23800B) 51.71331, 7.002239 51.719053, 7.002239 51.719478, 7.010479 51.713735, 7.008419 51.71331, 7.007561 </googlemap>


Allgemeine Informationen von MediaWiki (englisch, sehr technisch)

ZSxMRO <a href="http://ziufksjiuskq.com/">ziufksjiuskq</a>, [url=http://dfklvzonzyfd.com/]dfklvzonzyfd[/url], [link=http://odmqgygqqkmd.com/]odmqgygqqkmd[/link], http://piiuwklmncwr.com/

http://hdchc.com

Details

Die hier beschriebenen Funktionen können nicht über die grafische Oberfläche "zusammengeklickt" werden und benötigen einige tiefer gehende Kenntnisse.

Codebeschreibung

Schauen wir uns zunächst den Code an, der erzeugt wird. Er hat in etwa dieses aussehen:

 <googlemap version="0.9" lat="51.728517" lon="7.030392"
 icons="http://www.marion-me.de/wulfen/marker/marker{label}.png">
 51.728198, 7.030735, Barkenberger See
 [[Barkenberger See]]
 * Test Wiki-Syntax
 (info_rot) 51.715915, 7.005758, Gewerbegebiet Köhl
 6#99758BC5
 51.72203, 7.02507
 51.735108, 7.041721, Napoleonsweg
 51.740636, 7.047901
 51.750733, 7.066269
 6#7F3FF30E (#BB23800B)
 51.71331, 7.002239
 51.719053, 7.002239
 51.719478, 7.010479
 51.713735, 7.008419
 51.71331, 7.007561
 </googlemap>

Zwischen den <googlemap> Tags werden Informationen zu den Punkten, den Beschreibungen und über die Farbgebung der Pfade und Flächen gespeichert. Die Parameter "lat" und "lon" geben den Breiten- und Längengrad des Mittelpunkts der Karte an.

Ein Punkt hat immer zwei Koordinaten, den Längen- und den Breitengrad. In Wulfen bewegen wir uns bei etwa 51° Nördlich (südliche Koordinaten hätten ein Minuszeichen) und im Längengrad 7° östlich. Die Zahlenpaare stellen also immer Punkte dar. Pfade sind nichts anderes als eine Reihe von Punkten. Ihnen vorangestellt werden Daten über die Breite, die Transparenz und die Farbe, z.B. "6#99758BC5" = Breite von 6, Transparenz von 99 (Hexadezimal von 00 bis FF) und einer Farbe von 758BC5 (hexadezimale Werte für Rot- Grün- und Blauanteil, siehe Wikipedia-Artikel Hexadezimale Farbdefinition). Flächen haben dahinter zusätzlich einen Wert in runden Klammern. Dieser gibt die Transparenz und die Füllfarbe der Fläche an.


Nicht-Standard Marker benutzen

Standardmäßig kann über die Benutzeroberfläche nur der Google-Standardmarker sowie Marker mit Buchstaben ausgewählt werden. Man kann aber auch selbst gestaltete Marker nutzen. Im Wulfen-Wiki werden einige Marker bereitgestellt, die aber händisch eingefügt werden müssen.

Hierzu fügen wir im <googlemaps>-Tag hinter dem Parameter lon = " ... " aber noch vor der schließenden spitzen Klammer folgende Zeile ein:

icons="http://www.wulfen-wiki.de/extensions/GoogleMaps/marker/marker{label}.png"

Dann fügen wir VOR der Zeile mit dem Punkt, an dem wir den Marker nutzen wollen, den Namen des Markers in Klammern ein, z.B.

(gewaesser) 51.728198, 7.030735, Barkenberger See

Das ganze kann dann so aussehen:

<googlemap version="0.9" lat="51.728517" lon="7.030392"
icons="http://www.wulfen-wiki.de/extensions/GoogleMaps/images/custommarker/marker{label}.png">
(gewaesser) 51.728198, 7.030735, Barkenberger See
Irgendeine Beschreibung zum Barkenberger See
(info) 51.715915, 7.005758, Gewerbegebiet Köhl
</googlemap>

Folgene Icons können genutzt werden, der Name steht in Klammern darunter:

Custommarker.jpg

Speichert man die Karte, werden die richtigen Icons angezeigt.


Eigene Marker benutzen

Wenn eigene Icons benutzt werden sollen, müssen sie die Größe 20x34 Pixel haben (hochkant). Das Format sollte png sein, der Hintergrund transparent und der Name sollte markerNAME.png lauten. Diese müssen im Internet hochgeladen werden. Für die URL im Beispiel oben (www.wulfen-wiki.de/extension...) gibt man jetzt den Pfad des eigenen Markers an. Der einzufügende Text wäre dann (NAME).



Fragen und Antworten

Platz für Fragen: