Map: Unterschied zwischen den Versionen

Aus AntamarWiki
Wechseln zu: Navigation, Suche
(Die Seite wurde neu angelegt: „Das AOQML-Tag <map> legt eine [http://de.selfhtml.org/html/grafiken/verweis_sensitive.htm Imagemap] an. Somit können Questlinks auf einem Bild abgelegt …“)
 
(Syntax)
Zeile 3: Zeile 3:
 
== Syntax ==
 
== Syntax ==
 
<code xml n>
 
<code xml n>
<map src="" [width=""] [height=""]>
+
<map src="" [width=""] [height=""] [style=""]>
 
   <go target="" coords="">...</go>
 
   <go target="" coords="">...</go>
 
</map>
 
</map>
Zeile 12: Zeile 12:
 
* '''width''': Falls das  Bild kleiner angezeigt werden soll, kann hier die gewünschte Breite angegeben werden (als Zahlenwert).
 
* '''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).
 
* '''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:
 
go-Tag:

Version vom 24. September 2012, 22:06 Uhr

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>
</map>

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 Viereck 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

Innerhalb der umschließenden Klammern von <go>...</go> wird der anzuzeigende Tooltip spezifiziert.

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

Beispielquest

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