Imagemaps (2): Alternative shapes für

02.11.2016 04:30 Uhr

Verkehrsverbunde in NRW

Beim Klicken auf die Stadt Aachen und den Verkehrsverbund VRS erhalten Sie weiterführende Informationen.

<img src="http://www.hki.uni-koeln.de/sites/all/files/courses/7101/nrw_verbundtarife.gif"
      usemap="#verbund"
      alt="">
<p>
     <map name="verbund" id="verbund">
          <area shape="circle"
              coords="100, 400, 30"
              title="Stadt Aachen"
              target="new"
              href="http://de.wikipedia.org/wiki/Aachen"
              alt="">
          <area shape="poly"
              coords="157, 341, 277, 298, 338, 377, 154, 589, 134, 451, 189, 399"
              title="VRS"
              target="new"
              href ="http://de.wikipedia.org/wiki/Verkehrsverbund_Rhein-Sieg"
              alt="">
     </map>
<p>

Erläuterung

Um eine Stadt wie Aachen in einer Imagemap zu erfassen, kann es wie im vorliegenden Fall sinnvoll sein, eine Kreisform als <area>-Shape zu verwenden. Kreise werden durch den Wert „circle“ festgelegt und bestehen regelmäßig aus 3 durch Komma getrennten Zahlenwerten: x,y (Koordinate des Kreis-Mittelpunkts), r (Radius).

Um das Gebiet des Verkehrsverbundes Rhein-Sieg zu erfassen, ist weder ein reines Rechteck noch ein Kreis wirklich geeignet. Für einen solchen Fall gibt es die Polygonform. Polygone (Vielecke) werden durch den Wert „poly“ festgelegt und bestehen regelmäßig aus X*2 durch Komma getrennten Zahlenwerten: x1,y1 (1. Koordinate), x2,y2 (2. Koordinate), x3,y3 (3. Koordinate)…..xn, yn (n-te Koordinate).

Durch das Attribut title=““ kann man einer <area> einen Titel zuweisen, der dann zum Beispiel als Tool-Tip beim Mouse-Over angezeigt wird.

Schlagwörter: