Vorlage:Manueller Rahmen/Doku

Diese Seite ist die Dokumentations-Unterseite der Vorlage:Manueller Rahmen.

Diese Vorlage kann genutzt werden, um ein der Einbindung von Bildern entsprechendes Aussehen zu erreichen. Sie ist insbesondere für die Einbindung von mittels Vorlage:Graph:Chart erstellten Diagrammen gedacht.

Kopiervorlage

{{Manueller Rahmen
|content = 
|caption = 
|link    =
|width   = 
|align   = 
|pos     = 
}}

Parameter

Pflichtparameter

• content: Inhalt, üblicherweise die Einbindung eines Diagramms

Optionale Parameter

• caption: Beschriftung
• link: Link hinter dem Zoom-Icon unten rechts
• width: Breite in Pixel (ohne px); ohne Angabe passt sich der Rahmen am Inhalt an
• align: Mögliche Ausrichtung: right (rechts, Standard), left (links), center (zentriert)
• pos: Position der Beschriftung: bottom (unten, Standard), top (oben)

Beispiele

{{Manueller Rahmen
|content = {{Graph:Chart|width=400|height=100|xAxisTitle=X|yAxisTitle=Y|type=rect|x=1,2,3,4,5,8,9,10|y=10, 12, 6, 14, 2, 10, 7, 9}}
|caption = Beispiel-Säulendiagramm
}}

<graph>{"legends":[],"scales":[{"type":"ordinal","name":"x","zero":false,"domain":{"data":"chart","field":"x"},"padding":0.2,"range":"width","nice":true},{"type":"linear","name":"y","domain":{"data":"chart","field":"y"},"zero":true,"range":"height","nice":true},{"domain":{"data":"chart","field":"series"},"type":"ordinal","name":"color","range":"category10"}],"version":2,"marks":[{"type":"rect","properties":{"hover":{"fill":{"value":"red"}},"update":{"fill":{"scale":"color","field":"series"}},"enter":{"y":{"scale":"y","field":"y"},"x":{"scale":"x","field":"x"},"y2":{"scale":"y","value":0},"width":{"scale":"x","offset":-1,"band":true},"fill":{"scale":"color","field":"series"}}},"from":{"data":"chart"}}],"height":100,"axes":[{"type":"x","title":"X","scale":"x","format":"d","properties":{"title":{"fill":{"value":"#54595d"}},"grid":{"stroke":{"value":"#54595d"}},"ticks":{"stroke":{"value":"#54595d"}},"axis":{"strokeWidth":{"value":2},"stroke":{"value":"#54595d"}},"labels":{"fill":{"value":"#54595d"}}},"grid":false},{"type":"y","title":"Y","scale":"y","format":"d","properties":{"title":{"fill":{"value":"#54595d"}},"grid":{"stroke":{"value":"#54595d"}},"ticks":{"stroke":{"value":"#54595d"}},"axis":{"strokeWidth":{"value":2},"stroke":{"value":"#54595d"}},"labels":{"fill":{"value":"#54595d"}}},"grid":false}],"data":[{"format":{"parse":{"y":"integer","x":"integer"},"type":"json"},"name":"chart","values":[{"y":10,"series":"y","x":1},{"y":12,"series":"y","x":2},{"y":6,"series":"y","x":3},{"y":14,"series":"y","x":4},{"y":2,"series":"y","x":5},{"y":10,"series":"y","x":8},{"y":7,"series":"y","x":9},{"y":9,"series":"y","x":10}]}],"width":400}</graph>

Beispiel-Säulendiagramm

{{Manueller Rahmen
|content = {{Graph:Chart|width=100|height=100|type=pie|legend=Obstsorten|x=Äpfel,Birnen,Pfirsiche|y1=45,35,20}}
|width   = 300
|caption = Beispiel-Tortendiagramm
|align   = left
|pos     = top
}}

Beispiel-Tortendiagramm

<graph>{"legends":[{"properties":{"legend":{"y":{"value":-100}},"title":{"fill":{"value":"#54595d"}},"labels":{"fill":{"value":"#54595d"}}},"stroke":"color","title":"Obstsorten","fill":"color"}],"scales":[{"domain":{"data":"chart","field":"x"},"type":"ordinal","name":"color","range":"category10"}],"version":2,"marks":[{"type":"arc","properties":{"hover":{"fill":{"value":"red"}},"update":{"fill":{"scale":"color","field":"x"}},"enter":{"endAngle":{"field":"layout_end"},"innerRadius":{"value":0},"outerRadius":{"value":100},"startAngle":{"field":"layout_start"},"stroke":{"value":"white"},"fill":{"scale":"color","field":"x"},"strokeWidth":{"value":1}}},"from":{"data":"chart","transform":[{"type":"pie","field":"y"}]}}],"height":100,"axes":[],"data":[{"format":{"parse":{"y":"integer","x":"string"},"type":"json"},"name":"chart","values":[{"y":45,"x":"Äpfel"},{"y":35,"x":"Birnen"},{"y":20,"x":"Pfirsiche"}]}],"width":100}</graph>

Siehe auch

• Vorlage:Mehrere Bilder
• Vorlage:Panorama