SVG – Learning by Coding
1: <?xml version="1.0" encoding="ISO-8859-1" standalone="no"?>
2: <!-- generiert von einwohnerdaten.xsl -->
3: <!DOCTYPE svg
4: PUBLIC "-//W3C//DTD SVG 1.0//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
5: <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="800" height="600">
6: <title>Einwohnerzahlen am Stichtag 31.12.2002</title>
7: <desc>
8: XML-Daten wurden mittels XSLT in SVG umgewandelt - Material by Dr. Thomas Meinike 06/03
9: Verwendet wurde der XSLT-Prozessor Instant Saxon 6.5.2 - http://saxon.sourceforge.net
10: Programmaufruf:
11: saxon -o einwohnerdaten.svg einwohnerdaten.xml einwohnerdaten.xsl
12: </desc>
13: <defs>
14: <filter id="flt">
15: <feGaussianBlur in="SourceAlpha" stdDeviation="1" result="out1"/>
16: <feSpecularLighting in="out1" specularExponent="30" surfaceScale="10" result="out2">
17: <fePointLight x="50" y="100" z="300"/>
18: </feSpecularLighting>
19: <feComposite in="SourceGraphic" in2="out2" operator="arithmetic" k1="0" k2="1" k3="1" k4="0"/>
20: </filter>
21: <linearGradient id="lingra">
22: <stop offset="0%" style="stop-color: #F00"/>
23: <stop offset="75%" style="stop-color: #FF0"/>
24: <stop offset="100%" style="stop-color: #FFC"/>
25: </linearGradient>
26: <style type="text/css">
27:
28: rect
29: {
30: fill: url(#lingra);
31: filter: url(#flt);
32: stroke: #000;
33: stroke-width: 0.3px;
34: }
35:
36: text
37: {
38: font-size: 12px;
39: }
40:
41: text.headline
42: {
43: font-size: 24px;
44: fill: #00C;
45: }
46:
47: text.bundesland
48: {
49: font-weight: bold;
50: fill: #00C;
51: }
52:
53: text.legende
54: {
55: fill: #000;
56: }
57:
58: a text
59: {
60: fill: #F00;
61: text-decoration: underline;
62: }
63:
64: </style>
65: </defs>
66: <text x="10" y="30" class="headline">Einwohnerzahlen am Stichtag 31.12.2002</text>
67: <text x="10" y="50" class="legende">Legende: [Einwohner gesamt | Einwohner pro km²]</text>
68: <text x="10" y="82" class="bundesland">Baden-Württemberg</text>
69: <rect x="170" y="70" width="266.525" height="15"/>
70: <text x="446.525" y="82" class="legende">[10661000 | 298]</text>
71: <text x="10" y="107" class="bundesland">Bayern</text>
72: <rect x="170" y="95" width="309.675" height="15"/>
73: <text x="489.675" y="107" class="legende">[12387000 | 176]</text>
74: <text x="10" y="132" class="bundesland">Berlin</text>
75: <rect x="170" y="120" width="84.8" height="15"/>
76: <text x="264.8" y="132" class="legende">[3392000 | 3804]</text>
77: <text x="10" y="157" class="bundesland">Brandenburg</text>
78: <rect x="170" y="145" width="64.55" height="15"/>
79: <text x="244.55" y="157" class="legende">[2582000 | 88]</text>
80: <text x="10" y="182" class="bundesland">Bremen</text>
81: <rect x="170" y="170" width="16.55" height="15"/>
82: <text x="196.55" y="182" class="legende">[662000 | 1637]</text>
83: <text x="10" y="207" class="bundesland">Hamburg</text>
84: <rect x="170" y="195" width="43.225" height="15"/>
85: <text x="223.225" y="207" class="legende">[1729000 | 2289]</text>
86: <text x="10" y="232" class="bundesland">Hessen</text>
87: <rect x="170" y="220" width="152.3" height="15"/>
88: <text x="332.3" y="232" class="legende">[6092000 | 289]</text>
89: <text x="10" y="257" class="bundesland">Mecklenburg-Vorpommern</text>
90: <rect x="170" y="245" width="43.625" height="15"/>
91: <text x="223.625" y="257" class="legende">[1745000 | 75]</text>
92: <text x="10" y="282" class="bundesland">Niedersachsen</text>
93: <rect x="170" y="270" width="199.5" height="15"/>
94: <text x="379.5" y="282" class="legende">[7980000 | 168]</text>
95: <text x="10" y="307" class="bundesland">Nordrhein-Westfalen</text>
96: <rect x="170" y="295" width="451.9" height="15"/>
97: <text x="631.9" y="307" class="legende">[18076000 | 530]</text>
98: <text x="10" y="332" class="bundesland">Rheinland-Pfalz</text>
99: <rect x="170" y="320" width="101.45" height="15"/>
100: <text x="281.45" y="332" class="legende">[4058000 | 204]</text>
101: <text x="10" y="357" class="bundesland">Saarland</text>
102: <rect x="170" y="345" width="26.625" height="15"/>
103: <text x="206.625" y="357" class="legende">[1065000 | 415]</text>
104: <text x="10" y="382" class="bundesland">Sachsen</text>
105: <rect x="170" y="370" width="108.725" height="15"/>
106: <text x="288.725" y="382" class="legende">[4349000 | 236]</text>
107: <text x="10" y="407" class="bundesland">Sachsen-Anhalt</text>
108: <rect x="170" y="395" width="63.725" height="15"/>
109: <text x="243.725" y="407" class="legende">[2549000 | 125]</text>
110: <text x="10" y="432" class="bundesland">Schleswig-Holstein</text>
111: <rect x="170" y="420" width="70.425" height="15"/>
112: <text x="250.425" y="432" class="legende">[2817000 | 179]</text>
113: <text x="10" y="457" class="bundesland">Thüringen</text>
114: <rect x="170" y="445" width="59.8" height="15"/>
115: <text x="239.8" y="457" class="legende">[2392000 | 148]</text>
116: <text x="10" y="500">Diese Grafik wurde aus XML-Daten mittels XSLT erzeugt:</text>
117: <a xlink:href="einwohnerdaten.xml" target="_top">
118: <text x="320" y="500">XML-Dokument</text>
119: </a>
120: <a xlink:href="einwohnerdaten.xsl" target="_top">
121: <text x="410" y="500">XSL-Stylesheet</text>
122: </a>
123: <a xlink:href="http://www.destatis.de/jahrbuch/jahrtab1.htm" target="_top">
124: <text x="10" y="520">Datenquelle: Statistisches Bundesamt Deutschland</text>
125: </a>
126: </svg>
[zum Anfang]
