Vorlage:Annotiertes Bild/Doku

Kopiervorlagen

Alle Parameter sind mit Namen versehen. Zwei der Parameter schließen sich gegenseitig aus, image und imagemap.

Alle Parameter

{{Annotiertes Bild
| image = 
| imagemap = 
| float = 
| noframe = 
| caption = 
| alt = 
| page = 

| annot-font-size = 
| annot-color = 
| annot-font-family = 
| annot-text-align = 
| annot-background-color= 
| annot-font-weight = 
| annot-font-style = 
| annot-line-height = 
| annotations =

| image-width = 
| image-left = 
| image-top = 
| width = 
| height = 
| outer-css = 
| inner-css = 
}}

Annotation

{{Annotiertes Bild
| image = 
| imagemap = 
| float = 
| noframe = 
| caption = 
| alt = 
| page = 

| annot-color = 
| annot-background-color= 
| annot-font-family = 
| annot-font-size =
| annot-font-weight = 
| annot-font-style = 
| annot-text-align = 
| annot-line-height = 
| annotations =

| image-width = 
| outer-css = 
| inner-css = 
}}

Bildausschnitt

{{Annotiertes Bild
| image = 
| imagemap = 
| float = 
| noframe = 
| caption = 
| alt = 
| page = 

| image-width = 
| image-left = 
| image-top = 
| width = 
| height = 
| outer-css = 
| inner-css = 
}}

Annotation

Vorlage:Annotiertes Bild Zusammen mit der Vorlage:Annotation, die für die Darstellung der einzelnen Textlabels zuständig ist, lassen sich so beliebige Texte und Links auf einem Bild positionieren:

{{Annotiertes Bild
| image = Pacific_Ocean_-_panoramio_-_---%3DXEON%3D---_(1).jpg
| image-width = 400
| annot-color = #000000
| annot-font-weight = normal
| annot-font-size = 18
| annotations = 
{{Annotation|left=290|top=66 |text=Himmel}}
{{Annotation|left=167|top=147|text=Horizont| font-size=16 | font-weight=bold | color=#FFFFFF}}
{{Annotation|left=56 |top=233|text=Meer| font-size=16 | font-weight=bold | color=#FFFFFF}}
| caption = Ein annotiertes Bild
}}

Bildzuschnitt

Beim Beispielbild Datei:Mona Lisa color restoration2.jpg sollen nur Nase und Mundwinkel gezeigt werden:

Die Ursprungsbreite des Bildes von 300 Pixeln ist bei Verwendung dieser Vorlage die wichtigste Größe.	Die fünf Größen, die den Bildausschnitt auswählen: image-width legt den Skalierungsbild des Bildes fest. Steht dort die originale Bildgröße, wird das Bild nicht skaliert. Steht dort die doppelte Größe, wird die Bildgröße verdoppelt u.s.w. image-left ist meist eine negative Zahl und schneidet Pixel links im (ggf. reskalierten) Bild ab. image-top ist meist eine negative Zahl und schneidet Pixel oben im (ggf. reskalierten) Bild ab. width und height beschreiben die finale Bildgröße durch Abschneiden (oder Hinzufügen von weißen) Pixeln am rechten und unteren Rand.
Durch folgende Vorlage wird der Ausschnitt erzeugt: {{Annotiertes Bild | image = Mona Lisa color restoration2.jpg | image-width = 1800 | image-left = -768 | image-top = -720 | width = 240 | height = 240 | caption = Bildausschnitt der Pixel 128...167 × 120...159 }}
image = Mona Lisa color restoration2.jpg Der Name des Bildes ohne Protokoll (https://), Hostname (commons.wikimedia.org) und Pfad (/wiki/File:) https://commons.wikimedia.org/wiki/File:Mona Lisa color restoration2.jpg ⟶ Mona Lisa color restoration2.jpg image-width = 1800 Die neue Breite des Bildes: Da das alte Bild im Original 300 Pixel breit war, wird das Bild erst einmal um den Faktor $1800/300=6$ vergrößert. Alle folgenden Werte beziehen sich auf dieses um den Faktor 6 vergrößerte neue Bild! Von diesem wird oben und links was abgeschnitten und dann das Bild ausgewählt. image-left = -768 Es werden +768 Pixel vom linken Rand des vergrößerten neuen Bildes abgeschnitten. Das entspricht $768/6=128$ Pixel im originalen Bildes. image-top = -720 Es werden +720 Pixel vom oberen Rand des vergrößerten neuen Bildes abgeschnitten. Das entspricht $720/6=120$ Pixel des originalen Bildes. width = 240 Es werden horizontal 240 Pixel des vergrößerten neuen Bildes dargestellt. Das entspricht $240/6=40$ horizontale Pixel des originalen Bildes. height = 240 Es werden vertikal 240 Pixel des vergrößerten neuen Bildes dargestellt. Das entspricht $240/6=40$ vertikale Pixel des originalen Bildes. Ergebnis Im Endeffekt werden aus dem 300 × 260 Pixel großen Originalbild horizontal die Pixel 128...167 (40 Stück) und vertikal die Pixel 120...159 (40 Stück) dargestellt.

Bildvergrößerung im Bild

{{Annotiertes Bild
| image = Mona Lisa color restoration2.jpg
| image-width = 300
| outer-css = border: 8px outset #FFA500
| annotations =
{{Annotation|left=150|top=120|text=
{{Annotiertes Bild
| noframe = 1
| inner-css = border: 1px dashed
| image = Mona Lisa color restoration2.jpg
| image-width = 1000
| image-left = -425
| image-top = -400
| width = 110
| height = 110
}}
}}
| caption = Nase-Mund-Partie der Mona Lisa
}}

Anderes Bild im Bild

Mit doppeltem Rahmen

Ohne den Parameter noframe, mit inner-css. Vorlage:Annotiertes Bild

{{Annotiertes Bild
| image = Ludwigsdorf, Friedenseiche und Gedenkstein 1870-71 (13).jpg
| image-width = 400
| float = right
| annotations = {{Annotation|left=280|top=170|text={{Annotiertes Bild
| image = Ludwigsdorf, Friedenseiche und Gedenkstein 1870-71 (08).jpg
| image-width = 150
| image-left = -47
| image-top = -5
| width = 100
| height = 100
| float = left
| inner-css = border:5px; border-color:#00ff00; border-style:solid;
| caption =
}}
}}
| caption = Ludwigsdorfer Friedenseiche
}}

Mit Rahmen

Mit den Parametern noframe und inner-css für einen grünen Rand. Vorlage:Annotiertes Bild

{{Annotiertes Bild
| image = Ludwigsdorf, Friedenseiche und Gedenkstein 1870-71 (13).jpg
| image-width = 400
| float = right
| annotations = {{Annotation|left=280|top=170|text={{Annotiertes Bild
| noframe = 1
| image = Ludwigsdorf, Friedenseiche und Gedenkstein 1870-71 (08).jpg
| image-width = 150
| image-left = -47
| image-top = -5
| width = 100
| height = 100
| float = left
| inner-css = border:5px; border-color:#00ff00; border-style:solid;
| caption =
}}
}}
| caption = Ludwigsdorfer Friedenseiche
}}

Ohne Rahmen

Mit den Parametern noframe und inner-css border:none.

{{Annotiertes Bild
| image = Ludwigsdorf, Friedenseiche und Gedenkstein 1870-71 (13).jpg
| image-width = 400
| float = right
| annotations = {{Annotation|left=280|top=170|text={{Annotiertes Bild
| noframe = 1
| image = Ludwigsdorf, Friedenseiche und Gedenkstein 1870-71 (08).jpg
| image-width = 150
| image-left = -47
| image-top = -5
| width = 100
| height = 100
| float = left
| inner-css = border:none;
| caption =
}}
}}
| caption = Ludwigsdorfer Friedenseiche
}}

Mit dünnem weißem Rahmen

Mit den Parametern noframe, ohne inner-css. Vorlage:Annotiertes Bild

{{Annotiertes Bild
| image = Ludwigsdorf, Friedenseiche und Gedenkstein 1870-71 (13).jpg
| image-width = 400
| float = right
| annotations = {{Annotation|left=280|top=170|text={{Annotiertes Bild
| noframe = 1
| image = Ludwigsdorf, Friedenseiche und Gedenkstein 1870-71 (08).jpg
| image-width = 150
| image-left = -47
| image-top = -5
| width = 100
| height = 100
| float = left
| caption =
}}
}}
| caption = Ludwigsdorfer Friedenseiche
}}
|}

Siehe auch

• Vorlage:Annotation
• Vorlage:Große Imagemap