Map

Aus AntamarWiki
Wechseln zu: Navigation, Suche

Das AOQML-Tag <map> legt eine Imagemap an. Somit können Questlinks auf einem Bild abgelegt werden.

Syntax

<map src="" [width=""] [height=""] [style=""]>
  <go target="" coords="">...</go>
  [<info coords="">...</info>]
</map>

Mittels map legt man grundsätzlich den Bildbereich fest. Mit Hilfe der go-Tags gibt man die klickbaren Bereiche an, die zu anderen AOQML-Szenen führen. Mit Hilfe von info-Tags kann man, wenn gewünscht, Bereich festlegen, bei denen ein Tooltip erscheint, die aber nicht zu einer anderen AOQML-Szene führen.

map-Tag:

  • src: erwartet eine URL zum Bild, z.B. 'bilder/dungeons/Weinkeller.png'
  • width: Falls das Bild kleiner angezeigt werden soll, kann hier die gewünschte Breite angegeben werden (als Zahlenwert).
  • height: Falls das Bild kleiner angezeigt werden soll, kann hier die gewünschte Höhe angegeben werden (als Zahlenwert).
  • style: CSS Style-Angaben um z.B. Layer zu definieren, oder Text um das Bild fließen zu lassen.

go-Tag:

  • target: Der Name der verlinkten Szene
  • coords: Es werden vier Zahlen angegeben, die ein Rechteck definieren, z.B. '180,60,265,160'. Dabei bedeuten:
x1 = linke obere Ecke, Pixel von links
y1 = linke obere Ecke, Pixel von oben
x2 = rechte untere Ecke, Pixel von links
y2 = rechte untere Ecke, Pixel von oben

Wenn man kein Rechteck, sondern ein Vieleck für den Klickbereich definieren will, kann man auch mehr als vier Zahlen in coords angeben: x1,y1,x2,y2 ... xn,yn. Es können beliebig viele Ecken angegeben werden. Von der letzten definierten Ecke muss man sich eine Linie zur ersten definierten Ecke hinzudenken. Diese schließt das Polygon.

Wenn zwei oder mehr Felder, die durch <go> gebildet werden, übereinander liegen, wird jeweils die im Code oben stehende Zeile wirksam. Wenn man auf einer Imagemap beispielsweise einen Link "verstecken" möchte kann man zuunterst einen go-Tag definieren, der das ganze Bild abdeckt, aber zu einer ungünstigen oder wertlosen Szene führt. Lediglich die darüber angeordneten Felder führen zu den interessanten Szenen.

Beispiel

Der folgende Code

<map src="bilder/dungeons/Weinkeller.png">
  <go target="truhe" coords="388,215,440,265">Truhe ansehen</go>
  <go target="tisch" coords="288,160,350,218">Tisch ansehen</go>
  <go target="ausgang" coords="180,60,265,160">Keller verlassen</go>
</map>

erzeugt folgende Ausgabe
(die Maus fährt dabei gerade über den Tisch, deshalb wird dort der Tooltip angezeigt):
Imagemap-example.jpg


Beispiel 2: Info-Tag

<map src="bilder/dungeons/Weinkeller.png">
  <go target="truhe" coords="388,215,440,265">Truhe ansehen</go>
  <go target="ausgang" coords="180,60,265,160">Keller verlassen</go>
  <info coords="288,160,350,218">Der Tisch ist leer.</info>
</map>

Im Unterschied zu Beispiel 1 ist hier der Tisch nicht "klickbar", d.h. es wird keine separate AOQML-Szene aufgerufen, sondern beim Drüberfahren mit der Maus erscheint der Tooltip "Der Tisch ist leer.".


Beispielquest

Eine Beispielquest, bei der eine Imagemap verwendet wird (in der Szene keller.xml), kann hier heruntergeladen werden: Datei:Weinkeller.zip


Gimp-Vorlage für Dungeons

Pinsel für Gimp zur Gestaltung eigener Dungeons gibt es hier zum Download: http://spiel.antamar.org/Gimp-Dungeon-brushes_2014.rar