Benutzer:Antonsusi/Vorlage Kreisdiagramm

Dies ist die Quelltextvorlage für ein Kreisdiagramm. Wer sie nutzen will, darf das gerne tun, er sollte mich aber beim Upload als Autor der Vorlage nennen. ÅñŧóñŜûŝî (Ð) 14:41, 21. Jun. 2019 (CEST)

Vorlage für SVG

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!--
SVG-Vorlage für ein einfaches Kreisdiagramm. Der Radius des Kreises sind 1000 Einheiten.
Legende entweder rechts, unten oder außerhalb (also keine in der SVG). Platzhalter sind zu ersetzen.
-->
<!-- Werte für "Legende darunter"; für eine rechts entsprechend anpassen -->
<svg xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1"
	width="1200" height="1700" viewBox="0 0 2400 3400" xml:space="preserve" style="stroke-linecap:round;">
	<!-- Hintergrund festlegen, Der Rahmen (stroke) verhindert ein Abschneiden durch den Parser.
	Beim fertigen Diagramm das Beige (#FFFF99) durch Weiß (#FFFFFF) ersetzen sowie Breite und Höhe anpassen (je zwei Pixel weniger als die ganze Grafik).
	-->
	<rect id="papier" x="1" y="1" width="2398" height="3398" style="fill :#FFFF99; stroke :#FEFEFE; stroke-width :2;" />
	<!-- Titelzeilen Y-Werte und Diagramm-Offset ggf. anpassen. -->
		<text id="Titel" style="fill :#000000; stroke :none; font-family : Arial, sans-serif; font-size :140px; text-anchor :middle; font-weight :bold;"><!--
		--><tspan x="1200" y="160">TITELZEILE1</tspan><!--
		--><!--  <tspan x="1200" y="270">TITELZEILE2</tspan> --><!--
		--></text>
		<text id="Untertitel" style="fill :#000000; stroke :none; font-family : Arial, sans-serif; font-size :120px; text-anchor :middle; font-weight :bold;"><!--
		--><!-- <tspan x="1200" y="140">UNTERTITEL1</tspan>--><!--
		--><tspan x="1200" y="280">UNTERTITEL2</tspan><!--
		--></text>
	<!-- Nullpunkt in die Kreismitte; Für die Koordinaten auf der Kreislinie müssen die Prozentsätze
    aufsummiert und mit 3,6 multipliziert werden, um die Winkel zu erhalten.
    Werte für die Punkte auf dem Kreis:  SIN = 1000 * sin(Winkel) und   -COS =  - 1000 * cos(Winkel)
    -->
	<g transform="translate(1200,1300)" style="stroke:#000000; stroke-width:10;">
		<path d="M 0,0 L  SIN0,-COS0  A 1000,1000,0 0 1   SIN1,-COS1  z" style="fill:#FARBE01;" />
		<path d="M 0,0 L  SIN1,-COS1  A 1000,1000,0 0 1   SIN2,-COS2  z" style="fill:#FARBE02;" />
		<path d="M 0,0 L  SIN2,-COS2  A 1000,1000,0 0 1   SIN3,-COS3  z" style="fill:#FARBE03;" />
		<path d="M 0,0 L  SIN3,-COS3  A 1000,1000,0 0 1   SIN4,-COS4  z" style="fill:#FARBE04;" />
		<path d="M 0,0 L  SIN4,-COS4  A 1000,1000,0 0 1   SIN5,-COS5  z" style="fill:#FARBE05;" />
		<path d="M 0,0 L  SIN5,-COS5  A 1000,1000,0 0 1   SIN6,-COS6  z" style="fill:#FARBE06;" />
		<path d="M 0,0 L  SIN6,-COS6  A 1000,1000,0 0 1   SIN7,-COS7  z" style="fill:#FARBE07;" />
		<path d="M 0,0 L  SIN7,-COS7  A 1000,1000,0 0 1   SIN8,-COS8  z" style="fill:#FARBE08;" />
		<path d="M 0,0 L  SIN8,-COS8  A 1000,1000,0 0 1   SIN9,-COS9  z" style="fill:#FARBE09;" />
		<path d="M 0,0 L  SIN9,-COS9  A 1000,1000,0 0 1  SIN10,-COS10 z" style="fill:#FARBE10;" />
		<path d="M 0,0 L SIN10,-COS10 A 1000,1000,0 0 1  SIN11,-COS11 z" style="fill:#FARBE11;" />
		<path d="M 0,0 L SIN11,-COS11 A 1000,1000,0 0 1  SIN12,-COS12 z" style="fill:#FARBE12;" />
		<path d="M 0,0 L SIN12,-COS12 A 1000,1000,0 0 1  SIN13,-COS13 z" style="fill:#FARBE13;" />
		<path d="M 0,0 L SIN13,-COS13 A 1000,1000,0 0 1  SIN14,-COS14 z" style="fill:#FARBE14;" />
		<path d="M 0,0 L SIN14,-COS14 A 1000,1000,0 0 1  SIN15,-COS15 z" style="fill:#FARBE15;" />
		<path d="M 0,0 L SIN15,-COS15 A 1000,1000,0 0 1  SIN16,-COS16 z" style="fill:#FARBE16;" />
		<circle cx="0" cy="0" r="1000" style="fill:none;" />
	</g>
	<g id="LegendeUnten" transform="translate(50,2350)" style="fill :#000000; stroke:none; font-family: Arial, sans-serif; font-size:80px;">
		<!-- Texte ggf. auf beide Spalten verteilen -->+
		<g transform="translate(0,0  )"><rect x="0" y="10" width="100" height="100" style="fill :#FARBE01; stroke:#000000; stroke-width:10;" /><text x="120" y="85">TEXT01</text></g>
		<g transform="translate(0,130)"><rect x="0" y="10" width="100" height="100" style="fill :#FARBE02; stroke:#000000; stroke-width:10;" /><text x="120" y="85">TEXT02</text></g>
		<g transform="translate(0,260)"><rect x="0" y="10" width="100" height="100" style="fill :#FARBE03; stroke:#000000; stroke-width:10;" /><text x="120" y="85">TEXT03</text></g>
		<g transform="translate(0,390)"><rect x="0" y="10" width="100" height="100" style="fill :#FARBE04; stroke:#000000; stroke-width:10;" /><text x="120" y="85">TEXT04</text></g>
		<g transform="translate(0,520)"><rect x="0" y="10" width="100" height="100" style="fill :#FARBE05; stroke:#000000; stroke-width:10;" /><text x="120" y="85">TEXT05</text></g>
		<g transform="translate(0,650)"><rect x="0" y="10" width="100" height="100" style="fill :#FARBE06; stroke:#000000; stroke-width:10;" /><text x="120" y="85">TEXT06</text></g>
		<g transform="translate(0,780)"><rect x="0" y="10" width="100" height="100" style="fill :#FARBE07; stroke:#000000; stroke-width:10;" /><text x="120" y="85">TEXT07</text></g>
		<g transform="translate(0,910)"><rect x="0" y="10" width="100" height="100" style="fill :#FARBE08; stroke:#000000; stroke-width:10;" /><text x="120" y="85">TEXT08</text></g>
		<g transform="translate(1200,0)">
			<g transform="translate(0,0  )"><rect x="0" y="10" width="100" height="100" style="fill :#FARBE09; stroke:#000000; stroke-width:10;" /><text x="120" y="85">TEXT09</text></g>
			<g transform="translate(0,130)"><rect x="0" y="10" width="100" height="100" style="fill :#FARBE10; stroke:#000000; stroke-width:10;" /><text x="120" y="85">TEXT10</text></g>
			<g transform="translate(0,260)"><rect x="0" y="10" width="100" height="100" style="fill :#FARBE11; stroke:#000000; stroke-width:10;" /><text x="120" y="85">TEXT11</text></g>
			<g transform="translate(0,390)"><rect x="0" y="10" width="100" height="100" style="fill :#FARBE12; stroke:#000000; stroke-width:10;" /><text x="120" y="85">TEXT12</text></g>
			<g transform="translate(0,520)"><rect x="0" y="10" width="100" height="100" style="fill :#FARBE13; stroke:#000000; stroke-width:10;" /><text x="120" y="85">TEXT13</text></g>
			<g transform="translate(0,650)"><rect x="0" y="10" width="100" height="100" style="fill :#FARBE14; stroke:#000000; stroke-width:10;" /><text x="120" y="85">TEXT14</text></g>
			<g transform="translate(0,780)"><rect x="0" y="10" width="100" height="100" style="fill :#FARBE15; stroke:#000000; stroke-width:10;" /><text x="120" y="85">TEXT15</text></g>
			<g transform="translate(0,910)"><rect x="0" y="10" width="100" height="100" style="fill :#FARBE16; stroke:#000000; stroke-width:10;" /><text x="120" y="85">TEXT16</text></g>
		</g>
	</g>
</svg>

Berechnen der Koordinaten mittels Spezial:Vorlagen expandieren

Den (aufsummierten) Winkel unter "Kontexttitel" eingeben. Unter "Eingabe-Wikitext" folgendes eingeben:

     Prozent: {{PAGENAME}}<br />
   Sinus (X): {{#expr: 1000*sin({{PAGENAME}}*3.6/180*pi) round 1}}<br />
 Cosinus (Y): {{#expr:-1000*cos({{PAGENAME}}*3.6/180*pi) round 1}}<br />
   Parameter: {{#expr: 1000*sin({{PAGENAME}}*3.6/180*pi) round 0}},{{#expr:-1000*cos({{PAGENAME}}*3.6/180*pi) round 0}}