Sharepoint, verweissensitive Grafik, Image Map einbinden
Tags
<img src="Hier steht die URL des Bildes" alt="alternativer Titel"
width="345"
height="312"
usemap="#Landkarte">
<map name="Landkarte">
<area shape="rect" coords="255,132,316,150" href="Verweisziel" title="Titel">
</map>
erforderliche Attribute:
shape= : Festlegung der Flächenform
shape="rect": rechteckige Fläche
shape="circle" Kreis
shape="poly" beliebiges Vieleck
coords= : Angabe Koordinaten der verweis-sensitiven Flächen.
Pixelangaben = absolute Werte innerhalb der Grafik, welche verweis-sensitiv sein sollen.
Alle Pixelwerte werden durch Kommata getrennt.
Beispiel:
Viereck (shape="rect") = Koordinaten für x1,y1,x2,y2
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
Kreis (shape="circle") = Koordinaten für x,y,r
x = Mittelpunkt, Pixel von links
y = Mittelpunkt, Pixel von oben
r = Radius in Pixel
Polygon (shape="poly") = Koordinaten x1,y1,x2,y2 ... xn,yn
x = Pixel einer Ecke von links
y = Pixel einer Ecke von oben
Es können so viele Ecken definieren werden wie gewünscht.
Von der letzten definierten Ecke denkt man sich eine Linie zur ersten definierten Ecke.
Diese schließt das Polygon.
href = Verweisziel, das aufgerufen werden soll, wenn der Anwender die verweis-sensitive Fläche anklickt.
alt = Alternativtext für den Fall, dass verweis-sensitive Fläche nicht angezeigt werden kann (Pflichtattribut)
--- SCHNIPP Beispiel HTML Document mit verweissensitiver Grafik
<html>
<head><title>verweissensitive Grafik></title></head>
<img src="http://wiki.selfhtml.org/images/5/5e/Karte-deutschland-sw.jpg" width="690" height="582" alt="Karte" usemap="#Landkarte">
<map name="Landkarte">
<area shape="rect" coords="183,68,266,118"
href="http://www.frankfurt.de/" alt="Frankfurt" title="Sie haben Frankfurt ausgewählt">
<area shape="rect" coords="106,229,208,270"
href="http://www.mannheim.de/" alt="Mannheim" title="Sie haben Mannheim ausgewählt">
<area shape="rect" coords="180,271,270,308"
href="http://www.heidelberg.de/" alt="Heidelberg" title="Sie haben Heidelberg ausgewählt">
<area shape="rect" coords="388,162,460,201"
href="http://www.wuerzburg.de/" alt="Wuerzburg" title="Sie haben Wuerzburg ausgewählt">
<area shape="rect" coords="269,331,350,374"
href="http://www.heilbronn.de/" alt="Heilbronn" title="Sie haben Heilbronn ausgewählt">
<area shape="rect" coords="258,437,342,480"
href="http://www.stuttgart.de/" alt="Stuttgart" title="Sie haben Stuttgart ausgewählt">
</map>
</html>
--- SCHNAPP
Integration in den Sharepoint erfolgt über das [Content Editor Webpart]
1 Grafikdatei in Sharepoint Dokumentenbibliothek speichern
2 Content Editor Webpart auf der Portalseite einfügen
3 Content Editor Webpart editieren und unter [Edit Source] den HTML-Code einfügen,
URL zur Grafik-Datei anpassen
Mit dem kostenlosen tool Fast Image Map kann die Erstellung einer Image Map vereinfacht
werden.
weiterführende Informationen
<img src="Hier steht die URL des Bildes" alt="alternativer Titel"
width="345"
height="312"
usemap="#Landkarte">
<map name="Landkarte">
<area shape="rect" coords="255,132,316,150" href="Verweisziel" title="Titel">
</map>
erforderliche Attribute:
shape= : Festlegung der Flächenform
shape="rect": rechteckige Fläche
shape="circle" Kreis
shape="poly" beliebiges Vieleck
coords= : Angabe Koordinaten der verweis-sensitiven Flächen.
Pixelangaben = absolute Werte innerhalb der Grafik, welche verweis-sensitiv sein sollen.
Alle Pixelwerte werden durch Kommata getrennt.
Beispiel:
Viereck (shape="rect") = Koordinaten für x1,y1,x2,y2
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
Kreis (shape="circle") = Koordinaten für x,y,r
x = Mittelpunkt, Pixel von links
y = Mittelpunkt, Pixel von oben
r = Radius in Pixel
Polygon (shape="poly") = Koordinaten x1,y1,x2,y2 ... xn,yn
x = Pixel einer Ecke von links
y = Pixel einer Ecke von oben
Es können so viele Ecken definieren werden wie gewünscht.
Von der letzten definierten Ecke denkt man sich eine Linie zur ersten definierten Ecke.
Diese schließt das Polygon.
href = Verweisziel, das aufgerufen werden soll, wenn der Anwender die verweis-sensitive Fläche anklickt.
alt = Alternativtext für den Fall, dass verweis-sensitive Fläche nicht angezeigt werden kann (Pflichtattribut)
--- SCHNIPP Beispiel HTML Document mit verweissensitiver Grafik
<html>
<head><title>verweissensitive Grafik></title></head>
<img src="http://wiki.selfhtml.org/images/5/5e/Karte-deutschland-sw.jpg" width="690" height="582" alt="Karte" usemap="#Landkarte">
<map name="Landkarte">
<area shape="rect" coords="183,68,266,118"
href="http://www.frankfurt.de/" alt="Frankfurt" title="Sie haben Frankfurt ausgewählt">
<area shape="rect" coords="106,229,208,270"
href="http://www.mannheim.de/" alt="Mannheim" title="Sie haben Mannheim ausgewählt">
<area shape="rect" coords="180,271,270,308"
href="http://www.heidelberg.de/" alt="Heidelberg" title="Sie haben Heidelberg ausgewählt">
<area shape="rect" coords="388,162,460,201"
href="http://www.wuerzburg.de/" alt="Wuerzburg" title="Sie haben Wuerzburg ausgewählt">
<area shape="rect" coords="269,331,350,374"
href="http://www.heilbronn.de/" alt="Heilbronn" title="Sie haben Heilbronn ausgewählt">
<area shape="rect" coords="258,437,342,480"
href="http://www.stuttgart.de/" alt="Stuttgart" title="Sie haben Stuttgart ausgewählt">
</map>
</html>
--- SCHNAPP
Integration in den Sharepoint erfolgt über das [Content Editor Webpart]
1 Grafikdatei in Sharepoint Dokumentenbibliothek speichern
2 Content Editor Webpart auf der Portalseite einfügen
3 Content Editor Webpart editieren und unter [Edit Source] den HTML-Code einfügen,
URL zur Grafik-Datei anpassen
Mit dem kostenlosen tool Fast Image Map kann die Erstellung einer Image Map vereinfacht
werden.
weiterführende Informationen
Kommentare
Kommentar veröffentlichen