WCM Forum - Einzelnen Beitrag anzeigen

13.10.2000, 00:59

also das was du meins ist ein ImageMap. Dh. eine Grafik die in mehrere Bereiche, sogenannten Zonen aufgeteilt wird. Dh. es wird mit einem geeigneten Programm mehrere dieser Bereiche in Form von kooardinaten ermittelt un diese dann im Code der HTML Datei hinterlegt. Die Definition einer ImageMap erfolgt mit dem Tag <map>. Zusätzlich wird zu Beginn der Definition der Namer der entsprechenden Grafik eingegeben. Anschließend erfolg die Bezeichnung der einzelnen Bereiche der ImageMap mit dem Tag <area>. Hier übergibt man dem Attribut shape die Art der Figurenm welche von den ermittelten Koordinaten dargestellt werden. Anschließend folgen die Koordinaten sowie mit href das Ziel des entsprechenden Verweises. Nach dem Abschluß des Bereichs map wird die eigentliche Grafik zusammen mit dem Attribut usemap angegeben, welchs wieder den im Bereich von <map> angegebenen Namen enthält.

Figur : Beschreibung: Koordinaten:
rect Rechteck x1, y1, x2, y2 (oben links, rechst / unten links, rechts)

circle Kreis x1, y1, Radius (mittelpunkt, Radius)

polygon Vieleck x1, y1, ´x2, y2, x3, y3 ......

Beispiel:
In die HTML Datei wurde eine Grafik eingebunden, die über drei Bereiche aufgeteilt wurde. Der erste Bereich verweißt über ein Sprungziel innerhalb der eigenen Seite, während die beiden anderen Bereiche auf eine seperate HTML Datei verweisen.

(ich weiß, du willst keine Verweise, aber ich schreibs sicherheit halber dazu, villeicht willst du ja dann doch irgendwann verweise benützten)

<html>
<head>
<title>Titel</title>
</head>
<body>
<map name"bil1">
<area shape=rect coords="20.30.150.145" href="#anker">
<area shape=circle coords="50.50.130" href="Datei1.htm">
<area shape=polygon coords="1.1.60.15.75.17" href="Datei2.htm">
</map>
<img scr="landkarte.gif" usemap="#bild1" border=0>
</body>
</html>

Im Beispiel siehst du oben im <map> die ganzen Befehle ür dn Browser das er sich auskennt wo was ist. img src ist dann daß eigentliche Bild, und unter #usemap weiß der Browser dann daß dieses Bild zu den be genannten Koordinaten gehört.

Wie kommt man jetzt auf die Koordinaten ?

Da gibt es zum Beispiel das 30-Tage Programm unter http://www.boutell.com/mapedit (auch für Mac und Linux)

Nach dem Start wird man nach der HTML Datei gefragt die daß Bild enthält. Anschleißen prüft MapEdit auf Syntax.

In diesem Programm kannst du dann die Grafik mit Kreisen, Rechtecken und Polygonen versehen. Nach dem Beenden der Arbeit kann man dann die neu ermittelten Koordinaten als vollständigen Code in der HTML-Datei abspeichern lassen.

Die Koordinaten kann man aber auch mit fast jedem Beliebigen Grafik programm erstellen. um denn Bestimmten Bereich der Grafik ein Kästchen ziehen, und man sieht dann unten in der Leisten die Koordinaten. Diese Koordinaten kannst du dann wie im obrigen Beispiel einfügen.

So, wieder mal mein Wissen entleert

Viel Glück

MFG

(Bitte rechtschreib Fehler nicht beachten)

13.10.2000, 00:59	#3
Gast Beiträge: n/a	also das was du meins ist ein ImageMap. Dh. eine Grafik die in mehrere Bereiche, sogenannten Zonen aufgeteilt wird. Dh. es wird mit einem geeigneten Programm mehrere dieser Bereiche in Form von kooardinaten ermittelt un diese dann im Code der HTML Datei hinterlegt. Die Definition einer ImageMap erfolgt mit dem Tag <map>. Zusätzlich wird zu Beginn der Definition der Namer der entsprechenden Grafik eingegeben. Anschließend erfolg die Bezeichnung der einzelnen Bereiche der ImageMap mit dem Tag <area>. Hier übergibt man dem Attribut shape die Art der Figurenm welche von den ermittelten Koordinaten dargestellt werden. Anschließend folgen die Koordinaten sowie mit href das Ziel des entsprechenden Verweises. Nach dem Abschluß des Bereichs map wird die eigentliche Grafik zusammen mit dem Attribut usemap angegeben, welchs wieder den im Bereich von <map> angegebenen Namen enthält. Figur : Beschreibung: Koordinaten: rect Rechteck x1, y1, x2, y2 (oben links, rechst / unten links, rechts) circle Kreis x1, y1, Radius (mittelpunkt, Radius) polygon Vieleck x1, y1, ´x2, y2, x3, y3 ...... Beispiel: In die HTML Datei wurde eine Grafik eingebunden, die über drei Bereiche aufgeteilt wurde. Der erste Bereich verweißt über ein Sprungziel innerhalb der eigenen Seite, während die beiden anderen Bereiche auf eine seperate HTML Datei verweisen. (ich weiß, du willst keine Verweise, aber ich schreibs sicherheit halber dazu, villeicht willst du ja dann doch irgendwann verweise benützten) <html> <head> <title>Titel</title> </head> <body> <map name"bil1"> <area shape=rect coords="20.30.150.145" href="#anker"> <area shape=circle coords="50.50.130" href="Datei1.htm"> <area shape=polygon coords="1.1.60.15.75.17" href="Datei2.htm"> </map> <img scr="landkarte.gif" usemap="#bild1" border=0> </body> </html> Im Beispiel siehst du oben im <map> die ganzen Befehle ür dn Browser das er sich auskennt wo was ist. img src ist dann daß eigentliche Bild, und unter #usemap weiß der Browser dann daß dieses Bild zu den be genannten Koordinaten gehört. Wie kommt man jetzt auf die Koordinaten ? Da gibt es zum Beispiel das 30-Tage Programm unter http://www.boutell.com/mapedit (auch für Mac und Linux) Nach dem Start wird man nach der HTML Datei gefragt die daß Bild enthält. Anschleißen prüft MapEdit auf Syntax. In diesem Programm kannst du dann die Grafik mit Kreisen, Rechtecken und Polygonen versehen. Nach dem Beenden der Arbeit kann man dann die neu ermittelten Koordinaten als vollständigen Code in der HTML-Datei abspeichern lassen. Die Koordinaten kann man aber auch mit fast jedem Beliebigen Grafik programm erstellen. um denn Bestimmten Bereich der Grafik ein Kästchen ziehen, und man sieht dann unten in der Leisten die Koordinaten. Diese Koordinaten kannst du dann wie im obrigen Beispiel einfügen. So, wieder mal mein Wissen entleert Viel Glück MFG (Bitte rechtschreib Fehler nicht beachten)