Glossar: Komplettpaket (28 Eintraege, 19 SVGs, 5 DALL-E-Bilder, iPad, Experimente)
- Mindmap mit Force-directed Layout (pages/mindmap.php) + Cross-Links - 28 Eintraege im Fachartikel-Stil mit 113 Quellen + Inline-Referenzen [^n] - Leichte-Sprache-Version fuer alle 28 Eintraege (short_easy, text_easy, examples.text_easy) - 19 Infografiken (12 neu): co2-Keeling, klimawandel-Temp, kohlenstoff-Kreislauf, fotosynthese, energiemix-AT, methan-GWP, photovoltaik, wasserkraft, kipppunkt, biodiversitaet-LPI, permafrost, treibhausgas-GWP + bestehende (treibhauseffekt, ppm, windrad, albedo, fossile, kwh, co2-fussabdruck) - 5 DALL-E-Reprasentationsbilder im Querformat (nachhaltigkeit, klimaneutralitaet, erneuerbare-energie, emissionen, pariser-abkommen) - Alphabetische Sprungnavigation A-Z mit Buchstabenbannern - Lightbox-Vollbild auf allen Infografiken mit expliziten SVG-Dimensionen (Safari/iPad-Fix) - Easy-Sprache-Toggle pro Card mit localStorage-Persistenz - 4 interaktive Experimente: kWh-Rennen, ppm-Finder, albedo-Slider, CO2-Fussabdruck-Rechner - iPad-Optimierung: Touch-Ziele >=38px, Hover in @media (hover), touch-action - Modul-Metadaten aus DB-Tabelle module_info (keine Hardcodes) - Cache-Buster auf JS-Asset - Schema-Erweiterung: glossar_sources, examples.text_easy Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -0,0 +1,147 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 900 440" font-family="Inter, system-ui, sans-serif" width="900" height="440">
|
||||
<defs>
|
||||
<marker id="al-in" viewBox="0 0 10 10" refX="8" refY="5" markerWidth="5" markerHeight="5" orient="auto">
|
||||
<path d="M 0 0 L 10 5 L 0 10 z" fill="#e8833a"/>
|
||||
</marker>
|
||||
<marker id="al-out" viewBox="0 0 10 10" refX="8" refY="5" markerWidth="5" markerHeight="5" orient="auto">
|
||||
<path d="M 0 0 L 10 5 L 0 10 z" fill="#f4c94e"/>
|
||||
</marker>
|
||||
</defs>
|
||||
|
||||
<text x="450" y="30" font-size="16" font-weight="800" fill="#1f4e5a" text-anchor="middle">
|
||||
Albedo — Wie viel Sonnenlicht wirft die Oberfläche zurück?
|
||||
</text>
|
||||
<text x="450" y="50" font-size="11" fill="#8a8a8a" text-anchor="middle">
|
||||
Helle Oberflächen reflektieren viel, dunkle absorbieren Wärme. 1,0 = Spiegel · 0,0 = schwarz
|
||||
</text>
|
||||
|
||||
<!-- 5 vertikale Spalten: Schnee, Wüste, Wald, Ozean, Asphalt -->
|
||||
<!-- Jede Spalte: 160 px breit. Startet x=60 -->
|
||||
<!-- SURFACE, Albedo, Color -->
|
||||
|
||||
<!-- Column 1: Frischer Schnee A=0.85 -->
|
||||
<g transform="translate(80, 90)">
|
||||
<text y="-10" font-size="12" font-weight="800" fill="#1f4e5a" text-anchor="middle" x="70">❄ Frischer Schnee</text>
|
||||
<!-- Sonne-Pfeil rein -->
|
||||
<line x1="10" y1="0" x2="60" y2="70" stroke="#e8833a" stroke-width="2.5" marker-end="url(#al-in)"/>
|
||||
<!-- 85% raus (mehrere Pfeile) -->
|
||||
<g stroke="#f4c94e" stroke-width="2" fill="none" marker-end="url(#al-out)">
|
||||
<line x1="60" y1="70" x2="130" y2="10"/>
|
||||
<line x1="60" y1="70" x2="115" y2="0"/>
|
||||
<line x1="60" y1="70" x2="100" y2="-5"/>
|
||||
<line x1="60" y1="70" x2="130" y2="25"/>
|
||||
</g>
|
||||
<!-- Oberfläche -->
|
||||
<rect x="0" y="70" width="140" height="50" fill="#fff" stroke="#1f4e5a" stroke-width="1.5"/>
|
||||
<!-- Schnee-Sparkle -->
|
||||
<g fill="#4a7c8a" opacity=".4">
|
||||
<circle cx="20" cy="85" r="1"/><circle cx="50" cy="98" r="1"/>
|
||||
<circle cx="85" cy="82" r="1"/><circle cx="110" cy="100" r="1"/>
|
||||
<circle cx="130" cy="90" r="1"/>
|
||||
</g>
|
||||
<text x="70" y="140" font-size="24" font-weight="900" fill="#1f4e5a" text-anchor="middle">0,85</text>
|
||||
<text x="70" y="158" font-size="9" fill="#4a7c8a" text-anchor="middle">85 % zurückgeworfen</text>
|
||||
<!-- Balken 0-100% -->
|
||||
<rect x="10" y="175" width="120" height="8" fill="#dae8ec" rx="2"/>
|
||||
<rect x="10" y="175" width="102" height="8" fill="#4a7c8a" rx="2"/>
|
||||
</g>
|
||||
|
||||
<!-- Column 2: Wüste/Sand A=0.35 -->
|
||||
<g transform="translate(240, 90)">
|
||||
<text y="-10" font-size="12" font-weight="800" fill="#1f4e5a" text-anchor="middle" x="70">🏜 Wüste · Sand</text>
|
||||
<line x1="10" y1="0" x2="60" y2="70" stroke="#e8833a" stroke-width="2.5" marker-end="url(#al-in)"/>
|
||||
<g stroke="#f4c94e" stroke-width="2" fill="none" marker-end="url(#al-out)" opacity=".6">
|
||||
<line x1="60" y1="70" x2="115" y2="20"/>
|
||||
<line x1="60" y1="70" x2="100" y2="5"/>
|
||||
</g>
|
||||
<rect x="0" y="70" width="140" height="50" fill="#e8d5b5" stroke="#1f4e5a" stroke-width="1.5"/>
|
||||
<g fill="#c4a97a" opacity=".6">
|
||||
<circle cx="30" cy="88" r="2"/><circle cx="70" cy="100" r="2"/>
|
||||
<circle cx="110" cy="85" r="2"/>
|
||||
<path d="M 10 110 Q 35 106 60 110 Q 85 114 110 110 Q 125 108 130 110" fill="none" stroke="#c4a97a" stroke-width=".8"/>
|
||||
</g>
|
||||
<text x="70" y="140" font-size="24" font-weight="900" fill="#1f4e5a" text-anchor="middle">0,35</text>
|
||||
<text x="70" y="158" font-size="9" fill="#c4a97a" text-anchor="middle">35 % zurückgeworfen</text>
|
||||
<rect x="10" y="175" width="120" height="8" fill="#dae8ec" rx="2"/>
|
||||
<rect x="10" y="175" width="42" height="8" fill="#c4a97a" rx="2"/>
|
||||
</g>
|
||||
|
||||
<!-- Column 3: Wald A=0.12 -->
|
||||
<g transform="translate(400, 90)">
|
||||
<text y="-10" font-size="12" font-weight="800" fill="#1f4e5a" text-anchor="middle" x="70">🌲 Wald</text>
|
||||
<line x1="10" y1="0" x2="60" y2="70" stroke="#e8833a" stroke-width="2.5" marker-end="url(#al-in)"/>
|
||||
<g stroke="#f4c94e" stroke-width="1.5" fill="none" marker-end="url(#al-out)" opacity=".4">
|
||||
<line x1="60" y1="70" x2="95" y2="35"/>
|
||||
</g>
|
||||
<rect x="0" y="70" width="140" height="50" fill="#3a6b3e" stroke="#1f4e5a" stroke-width="1.5"/>
|
||||
<!-- Baumsymbole -->
|
||||
<g fill="#5a8a5e">
|
||||
<polygon points="15,115 22,92 29,115"/>
|
||||
<polygon points="42,115 50,88 58,115"/>
|
||||
<polygon points="70,115 80,85 90,115"/>
|
||||
<polygon points="100,115 108,90 116,115"/>
|
||||
<polygon points="122,115 130,93 138,115"/>
|
||||
</g>
|
||||
<text x="70" y="140" font-size="24" font-weight="900" fill="#1f4e5a" text-anchor="middle">0,12</text>
|
||||
<text x="70" y="158" font-size="9" fill="#3a6b3e" text-anchor="middle">12 % zurückgeworfen</text>
|
||||
<rect x="10" y="175" width="120" height="8" fill="#dae8ec" rx="2"/>
|
||||
<rect x="10" y="175" width="14" height="8" fill="#3a6b3e" rx="2"/>
|
||||
</g>
|
||||
|
||||
<!-- Column 4: Ozean A=0.06 -->
|
||||
<g transform="translate(560, 90)">
|
||||
<text y="-10" font-size="12" font-weight="800" fill="#1f4e5a" text-anchor="middle" x="70">🌊 Ozean</text>
|
||||
<line x1="10" y1="0" x2="60" y2="70" stroke="#e8833a" stroke-width="2.5" marker-end="url(#al-in)"/>
|
||||
<g stroke="#f4c94e" stroke-width="1" fill="none" marker-end="url(#al-out)" opacity=".3">
|
||||
<line x1="60" y1="70" x2="85" y2="45"/>
|
||||
</g>
|
||||
<rect x="0" y="70" width="140" height="50" fill="#1f4e5a" stroke="#1f4e5a" stroke-width="1.5"/>
|
||||
<!-- Wellen -->
|
||||
<g fill="none" stroke="#4a7c8a" stroke-width=".8" opacity=".5">
|
||||
<path d="M 5 85 Q 20 82 35 85 Q 50 88 65 85 Q 80 82 95 85 Q 110 88 125 85 Q 135 83 138 85"/>
|
||||
<path d="M 5 100 Q 20 97 35 100 Q 50 103 65 100 Q 80 97 95 100 Q 110 103 125 100 Q 135 98 138 100"/>
|
||||
</g>
|
||||
<text x="70" y="140" font-size="24" font-weight="900" fill="#1f4e5a" text-anchor="middle">0,06</text>
|
||||
<text x="70" y="158" font-size="9" fill="#1f4e5a" text-anchor="middle">6 % zurückgeworfen</text>
|
||||
<rect x="10" y="175" width="120" height="8" fill="#dae8ec" rx="2"/>
|
||||
<rect x="10" y="175" width="7" height="8" fill="#1f4e5a" rx="2"/>
|
||||
</g>
|
||||
|
||||
<!-- Column 5: Asphalt A=0.05 -->
|
||||
<g transform="translate(720, 90)">
|
||||
<text y="-10" font-size="12" font-weight="800" fill="#1f4e5a" text-anchor="middle" x="70">🛣 Asphalt</text>
|
||||
<line x1="10" y1="0" x2="60" y2="70" stroke="#e8833a" stroke-width="2.5" marker-end="url(#al-in)"/>
|
||||
<g stroke="#f4c94e" stroke-width="1" fill="none" marker-end="url(#al-out)" opacity=".25">
|
||||
<line x1="60" y1="70" x2="80" y2="50"/>
|
||||
</g>
|
||||
<rect x="0" y="70" width="140" height="50" fill="#2a2a2a" stroke="#1f4e5a" stroke-width="1.5"/>
|
||||
<!-- Straßenmarkierung -->
|
||||
<g fill="#fff" opacity=".8">
|
||||
<rect x="20" y="93" width="14" height="3"/>
|
||||
<rect x="50" y="93" width="14" height="3"/>
|
||||
<rect x="80" y="93" width="14" height="3"/>
|
||||
<rect x="110" y="93" width="14" height="3"/>
|
||||
</g>
|
||||
<text x="70" y="140" font-size="24" font-weight="900" fill="#1f4e5a" text-anchor="middle">0,05</text>
|
||||
<text x="70" y="158" font-size="9" fill="#2a2a2a" text-anchor="middle">5 % zurückgeworfen</text>
|
||||
<rect x="10" y="175" width="120" height="8" fill="#dae8ec" rx="2"/>
|
||||
<rect x="10" y="175" width="6" height="8" fill="#2a2a2a" rx="2"/>
|
||||
</g>
|
||||
|
||||
<!-- Erklärung Rückkopplung -->
|
||||
<g transform="translate(50, 310)">
|
||||
<rect x="0" y="0" width="800" height="110" rx="8" fill="#fff" stroke="#dae8ec" stroke-width="1"/>
|
||||
<text x="20" y="22" font-size="12" font-weight="800" fill="#1f4e5a">⚠ Warum das Klima betrifft: Die Eis-Albedo-Rückkopplung</text>
|
||||
|
||||
<text x="20" y="46" font-size="10" fill="#4a4a4a">1.</text>
|
||||
<text x="38" y="46" font-size="10" fill="#4a4a4a">Das Klima wird wärmer → Meereis und Gletscher schmelzen.</text>
|
||||
|
||||
<text x="20" y="64" font-size="10" fill="#4a4a4a">2.</text>
|
||||
<text x="38" y="64" font-size="10" fill="#4a4a4a">Statt weißem Eis (A=0,85) liegt nun dunkler Ozean (A=0,06) oder dunkler Boden unter der Sonne.</text>
|
||||
|
||||
<text x="20" y="82" font-size="10" fill="#4a4a4a">3.</text>
|
||||
<text x="38" y="82" font-size="10" fill="#4a4a4a">Die Oberfläche absorbiert viel mehr Wärme → das Klima wird noch wärmer → mehr Eis schmilzt.</text>
|
||||
|
||||
<text x="20" y="100" font-size="10" fill="#c85c4a" font-weight="700">→ Eine sich selbst verstärkende Rückkopplung — einer der Gründe für den beschleunigten Klimawandel in der Arktis.</text>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 8.2 KiB |
@@ -0,0 +1,58 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 900 440" font-family="Inter, system-ui, sans-serif" width="900" height="440">
|
||||
<text x="450" y="30" font-size="16" font-weight="800" fill="#1f4e5a" text-anchor="middle">
|
||||
Living Planet Index — Wirbeltier-Populationen haben sich seit 1970 mehr als gedrittelt
|
||||
</text>
|
||||
<text x="450" y="50" font-size="11" fill="#8a8a8a" text-anchor="middle">
|
||||
Mittelwert von weltweit 34.836 beobachteten Populationen · Datenstand 2024
|
||||
</text>
|
||||
|
||||
<!-- Plot: x 80..750, y 90..340. X: 1970..2020 = 50 a in 670 px → 13.4 px/a. Y: 100%..25% = 75% in 250 px → 3.33 px/% -->
|
||||
<line x1="80" y1="340" x2="750" y2="340" stroke="#1f4e5a" stroke-width="1.5"/>
|
||||
<line x1="80" y1="90" x2="80" y2="340" stroke="#1f4e5a" stroke-width="1.5"/>
|
||||
|
||||
<!-- Y Grid -->
|
||||
<g font-size="10" fill="#4a4a4a" text-anchor="end">
|
||||
<line x1="80" y1="90" x2="750" y2="90" stroke="#dae8ec" stroke-width=".5"/><text x="74" y="93">100 %</text>
|
||||
<line x1="80" y1="173.3" x2="750" y2="173.3" stroke="#dae8ec" stroke-width=".5"/><text x="74" y="176.3">75 %</text>
|
||||
<line x1="80" y1="256.7" x2="750" y2="256.7" stroke="#dae8ec" stroke-width=".5"/><text x="74" y="259.7">50 %</text>
|
||||
<line x1="80" y1="340" x2="750" y2="340" stroke="#dae8ec" stroke-width=".5"/><text x="74" y="343">25 %</text>
|
||||
</g>
|
||||
<text x="20" y="215" font-size="11" font-weight="700" fill="#1f4e5a" transform="rotate(-90 20 215)" text-anchor="middle">Population Index</text>
|
||||
|
||||
<!-- X Achse -->
|
||||
<g font-size="10" fill="#4a4a4a" text-anchor="middle">
|
||||
<line x1="80" y1="340" x2="80" y2="345" stroke="#1f4e5a"/><text x="80" y="360">1970</text>
|
||||
<line x1="214" y1="340" x2="214" y2="345" stroke="#1f4e5a"/><text x="214" y="360">1980</text>
|
||||
<line x1="348" y1="340" x2="348" y2="345" stroke="#1f4e5a"/><text x="348" y="360">1990</text>
|
||||
<line x1="482" y1="340" x2="482" y2="345" stroke="#1f4e5a"/><text x="482" y="360">2000</text>
|
||||
<line x1="616" y1="340" x2="616" y2="345" stroke="#1f4e5a"/><text x="616" y="360">2010</text>
|
||||
<line x1="750" y1="340" x2="750" y2="345" stroke="#1f4e5a"/><text x="750" y="360">2020</text>
|
||||
</g>
|
||||
|
||||
<!-- Linie — grobe Approximation der globalen LPI-Kurve 1970→2020 (100→27%) -->
|
||||
<!-- Stützpunkte %: 1970=100, 1980=84, 1990=67, 2000=52, 2010=42, 2020=27
|
||||
y(%) = 90 + (100-%)*3.333 -->
|
||||
<polyline fill="none" stroke="#c85c4a" stroke-width="3" stroke-linejoin="round"
|
||||
points="80,90 214,143.3 348,200 482,250 616,283.3 750,333.3"/>
|
||||
<!-- Unsicherheitsband (sehr vereinfacht) -->
|
||||
<polyline fill="#c85c4a" fill-opacity=".12" stroke="none"
|
||||
points="80,90 214,120 348,175 482,220 616,260 750,305 750,360 616,305 482,280 348,230 214,170 80,110"/>
|
||||
|
||||
<!-- Endmarke -->
|
||||
<circle cx="750" cy="333.3" r="6" fill="#c85c4a"/>
|
||||
<text x="740" y="325" font-size="12" font-weight="800" fill="#c85c4a" text-anchor="end">2020 · 27 %</text>
|
||||
<text x="740" y="310" font-size="10" fill="#c85c4a" text-anchor="end">(−73 % gegenüber 1970)</text>
|
||||
|
||||
<!-- Startmarke -->
|
||||
<circle cx="80" cy="90" r="6" fill="#5a8a5e"/>
|
||||
<text x="90" y="86" font-size="12" font-weight="800" fill="#5a8a5e">1970 · 100 % (Referenz)</text>
|
||||
|
||||
<!-- Ursachen-Icons -->
|
||||
<g transform="translate(80,380)">
|
||||
<rect x="0" y="0" width="670" height="35" rx="4" fill="#fff" stroke="#dae8ec"/>
|
||||
<text x="10" y="15" font-size="10" font-weight="800" fill="#1f4e5a">Hauptursachen:</text>
|
||||
<text x="96" y="15" font-size="10" fill="#4a4a4a">🌾 Landnutzung · 🌡️ Klimawandel · 🪓 Übernutzung · 🐀 Invasive Arten · 🏭 Verschmutzung</text>
|
||||
<text x="10" y="28" font-size="10" font-weight="800" fill="#1f4e5a">Quelle:</text>
|
||||
<text x="56" y="28" font-size="10" fill="#4a4a4a">WWF & Zoological Society of London (2024): Living Planet Report 2024 · IPBES Global Assessment 2019</text>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.8 KiB |
@@ -0,0 +1,110 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 900 480" font-family="Inter, system-ui, sans-serif" width="900" height="480">
|
||||
<text x="450" y="32" font-size="16" font-weight="800" fill="#1f4e5a" text-anchor="middle">
|
||||
CO₂-Fußabdruck in Österreich — 8 Tonnen pro Person pro Jahr
|
||||
</text>
|
||||
<text x="450" y="52" font-size="11" fill="#8a8a8a" text-anchor="middle">
|
||||
Aufgeteilt auf die vier großen Lebensbereiche. Klimaneutral wären unter 1 t.
|
||||
</text>
|
||||
|
||||
<!-- Vier Säulen, jede 2 t CO₂ = Höhe 140 px. 1t = 70 px -->
|
||||
<!-- Basis bei y=340 -->
|
||||
<g>
|
||||
<!-- Säule Wohnen (Heizung + Strom) 2 t -->
|
||||
<g transform="translate(165, 340)">
|
||||
<rect x="-55" y="-140" width="110" height="140" fill="#4a7c8a" stroke="#1f4e5a" stroke-width="1"/>
|
||||
<rect x="-55" y="-140" width="110" height="15" fill="#3a6470"/>
|
||||
<text y="-150" font-size="16" font-weight="900" fill="#1f4e5a" text-anchor="middle">2,0 t</text>
|
||||
<text y="-132" font-size="12" font-weight="700" fill="#fff" text-anchor="middle">🏠 Wohnen</text>
|
||||
<text y="-115" font-size="9" fill="#dae8ec" text-anchor="middle">Heizung · Strom</text>
|
||||
<text y="-102" font-size="9" fill="#dae8ec" text-anchor="middle">Warmwasser</text>
|
||||
<text y="14" font-size="11" font-weight="700" fill="#1f4e5a" text-anchor="middle">Wohnen</text>
|
||||
<text y="28" font-size="9" fill="#8a8a8a" text-anchor="middle">25 % Anteil</text>
|
||||
</g>
|
||||
<!-- Säule Verkehr 2 t -->
|
||||
<g transform="translate(335, 340)">
|
||||
<rect x="-55" y="-140" width="110" height="140" fill="#c85c4a" stroke="#1f4e5a" stroke-width="1"/>
|
||||
<rect x="-55" y="-140" width="110" height="15" fill="#a9443a"/>
|
||||
<text y="-150" font-size="16" font-weight="900" fill="#1f4e5a" text-anchor="middle">2,0 t</text>
|
||||
<text y="-132" font-size="12" font-weight="700" fill="#fff" text-anchor="middle">🚗 Verkehr</text>
|
||||
<text y="-115" font-size="9" fill="#f0d0ca" text-anchor="middle">Auto · Flug</text>
|
||||
<text y="-102" font-size="9" fill="#f0d0ca" text-anchor="middle">Pendeln</text>
|
||||
<text y="14" font-size="11" font-weight="700" fill="#1f4e5a" text-anchor="middle">Verkehr</text>
|
||||
<text y="28" font-size="9" fill="#8a8a8a" text-anchor="middle">25 % Anteil</text>
|
||||
</g>
|
||||
<!-- Säule Ernährung 2 t -->
|
||||
<g transform="translate(505, 340)">
|
||||
<rect x="-55" y="-140" width="110" height="140" fill="#5a8a5e" stroke="#1f4e5a" stroke-width="1"/>
|
||||
<rect x="-55" y="-140" width="110" height="15" fill="#3a6b3e"/>
|
||||
<text y="-150" font-size="16" font-weight="900" fill="#1f4e5a" text-anchor="middle">2,0 t</text>
|
||||
<text y="-132" font-size="12" font-weight="700" fill="#fff" text-anchor="middle">🥩 Ernährung</text>
|
||||
<text y="-115" font-size="9" fill="#dcead0" text-anchor="middle">Fleisch · Milch</text>
|
||||
<text y="-102" font-size="9" fill="#dcead0" text-anchor="middle">Importe</text>
|
||||
<text y="14" font-size="11" font-weight="700" fill="#1f4e5a" text-anchor="middle">Ernährung</text>
|
||||
<text y="28" font-size="9" fill="#8a8a8a" text-anchor="middle">25 % Anteil</text>
|
||||
</g>
|
||||
<!-- Säule Konsum 2 t -->
|
||||
<g transform="translate(675, 340)">
|
||||
<rect x="-55" y="-140" width="110" height="140" fill="#e8833a" stroke="#1f4e5a" stroke-width="1"/>
|
||||
<rect x="-55" y="-140" width="110" height="15" fill="#b8641d"/>
|
||||
<text y="-150" font-size="16" font-weight="900" fill="#1f4e5a" text-anchor="middle">2,0 t</text>
|
||||
<text y="-132" font-size="12" font-weight="700" fill="#fff" text-anchor="middle">🛒 Konsum</text>
|
||||
<text y="-115" font-size="9" fill="#f5e0c8" text-anchor="middle">Kleidung</text>
|
||||
<text y="-102" font-size="9" fill="#f5e0c8" text-anchor="middle">Elektronik</text>
|
||||
<text y="14" font-size="11" font-weight="700" fill="#1f4e5a" text-anchor="middle">Konsum</text>
|
||||
<text y="28" font-size="9" fill="#8a8a8a" text-anchor="middle">25 % Anteil</text>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<!-- Klimaneutralitäts-Linie bei 1 t (= 70 px über Basis) -->
|
||||
<g>
|
||||
<line x1="90" y1="270" x2="750" y2="270" stroke="#3a6b3e" stroke-width="2" stroke-dasharray="6 4"/>
|
||||
<text x="760" y="266" font-size="10" fill="#3a6b3e" font-weight="800">1 t = Klimaneutral-Ziel</text>
|
||||
<text x="760" y="278" font-size="9" fill="#8a8a8a">(pro Person pro Jahr)</text>
|
||||
</g>
|
||||
|
||||
<!-- Summen-Ballon oben -->
|
||||
<g transform="translate(450, 110)">
|
||||
<circle r="42" fill="#c85c4a" stroke="#1f4e5a" stroke-width="1.5"/>
|
||||
<text y="-6" font-size="22" font-weight="900" fill="#fff" text-anchor="middle">8 t</text>
|
||||
<text y="13" font-size="10" font-weight="700" fill="#fff" text-anchor="middle">CO₂ / Jahr</text>
|
||||
<text y="25" font-size="9" fill="#f0d0ca" text-anchor="middle">pro Person</text>
|
||||
</g>
|
||||
|
||||
<!-- X-Achse -->
|
||||
<line x1="90" y1="340" x2="750" y2="340" stroke="#1f4e5a" stroke-width="2"/>
|
||||
|
||||
<!-- Y-Achse mit Tonnen-Markierungen -->
|
||||
<g>
|
||||
<line x1="90" y1="130" x2="90" y2="340" stroke="#1f4e5a" stroke-width="1.5"/>
|
||||
<g font-size="9" fill="#4a4a4a" text-anchor="end">
|
||||
<line x1="86" y1="340" x2="90" y2="340" stroke="#1f4e5a"/><text x="84" y="343">0 t</text>
|
||||
<line x1="86" y1="270" x2="90" y2="270" stroke="#1f4e5a"/><text x="84" y="273">1 t</text>
|
||||
<line x1="86" y1="200" x2="90" y2="200" stroke="#1f4e5a"/><text x="84" y="203">2 t</text>
|
||||
<line x1="86" y1="130" x2="90" y2="130" stroke="#1f4e5a"/><text x="84" y="133">3 t</text>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<!-- Vergleichsbox unten -->
|
||||
<g transform="translate(0, 370)">
|
||||
<rect x="50" y="0" width="800" height="95" rx="8" fill="#fff" stroke="#dae8ec" stroke-width="1"/>
|
||||
<text x="70" y="22" font-size="11" fill="#1f4e5a" font-weight="800">So viel CO₂ ist das konkret:</text>
|
||||
|
||||
<text x="70" y="45" font-size="10" fill="#4a4a4a">🚗 Ein Jahr Auto (10.000 km):</text>
|
||||
<text x="270" y="45" font-size="10" fill="#c85c4a" font-weight="700">1,6 t CO₂</text>
|
||||
|
||||
<text x="400" y="45" font-size="10" fill="#4a4a4a">✈ Flug Wien–Bali + zurück:</text>
|
||||
<text x="580" y="45" font-size="10" fill="#c85c4a" font-weight="700">3,5 t CO₂</text>
|
||||
|
||||
<text x="70" y="63" font-size="10" fill="#4a4a4a">🍖 Ein Jahr Fleisch essen:</text>
|
||||
<text x="270" y="63" font-size="10" fill="#c85c4a" font-weight="700">1,2 t CO₂</text>
|
||||
|
||||
<text x="400" y="63" font-size="10" fill="#4a4a4a">🥗 Ein Jahr vegan statt Fleisch:</text>
|
||||
<text x="580" y="63" font-size="10" fill="#5a8a5e" font-weight="700">−0,7 t CO₂</text>
|
||||
|
||||
<text x="70" y="81" font-size="10" fill="#4a4a4a">🏭 Welt-Durchschnitt pro Kopf:</text>
|
||||
<text x="270" y="81" font-size="10" fill="#4a7c8a" font-weight="700">4,7 t CO₂</text>
|
||||
|
||||
<text x="400" y="81" font-size="10" fill="#4a4a4a">🇺🇸 USA: 14 t · 🇮🇳 Indien: 1,9 t · 🌍 Klima-Ziel:</text>
|
||||
<text x="650" y="81" font-size="10" fill="#5a8a5e" font-weight="700">unter 1 t</text>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 6.7 KiB |
@@ -0,0 +1,82 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 900 460" font-family="Inter, system-ui, sans-serif" width="900" height="460">
|
||||
<defs>
|
||||
<linearGradient id="co2-fill" x1="0" y1="0" x2="0" y2="1">
|
||||
<stop offset="0" stop-color="#c85c4a" stop-opacity=".35"/>
|
||||
<stop offset="1" stop-color="#c85c4a" stop-opacity="0"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
<text x="450" y="30" font-size="16" font-weight="800" fill="#1f4e5a" text-anchor="middle">
|
||||
CO₂ in der Atmosphäre — seit 1750 um rund 50 % gestiegen
|
||||
</text>
|
||||
<text x="450" y="50" font-size="11" fill="#8a8a8a" text-anchor="middle">
|
||||
Datengrundlage: Eisbohrkerne (Law Dome, Antarktis) + NOAA Mauna Loa 1958–2024
|
||||
</text>
|
||||
|
||||
<!-- Achsen -->
|
||||
<!-- Plot-Fläche: x 80..870, y 90..380 -->
|
||||
<line x1="80" y1="380" x2="870" y2="380" stroke="#1f4e5a" stroke-width="1.5"/>
|
||||
<line x1="80" y1="90" x2="80" y2="380" stroke="#1f4e5a" stroke-width="1.5"/>
|
||||
|
||||
<!-- Y-Grid + Labels (ppm) -->
|
||||
<g font-size="10" fill="#4a4a4a" text-anchor="end">
|
||||
<!-- Range: 250 → 450 ppm = 200 ppm auf 290 px → 1,45 px/ppm -->
|
||||
<!-- Positionen: 250(380), 300(307.5), 350(235), 400(162.5), 450(90) -->
|
||||
<line x1="80" y1="380" x2="870" y2="380" stroke="#dae8ec" stroke-width=".5"/>
|
||||
<line x1="80" y1="307.5" x2="870" y2="307.5" stroke="#dae8ec" stroke-width=".5"/>
|
||||
<line x1="80" y1="235" x2="870" y2="235" stroke="#dae8ec" stroke-width=".5"/>
|
||||
<line x1="80" y1="162.5" x2="870" y2="162.5" stroke="#dae8ec" stroke-width=".5"/>
|
||||
<line x1="80" y1="90" x2="870" y2="90" stroke="#dae8ec" stroke-width=".5"/>
|
||||
<text x="74" y="383">250</text>
|
||||
<text x="74" y="310.5">300</text>
|
||||
<text x="74" y="238">350</text>
|
||||
<text x="74" y="165.5">400</text>
|
||||
<text x="74" y="93">450</text>
|
||||
</g>
|
||||
<text x="30" y="240" font-size="11" font-weight="700" fill="#1f4e5a" transform="rotate(-90 30 240)" text-anchor="middle">CO₂-Konzentration in ppm</text>
|
||||
|
||||
<!-- X-Achse: 1750 → 2025 = 275 Jahre auf 790 px → 2,87 px/Jahr -->
|
||||
<!-- Jahre: 1750(80), 1800(223.5), 1850(367), 1900(510), 1950(654), 2000(797), 2025(870) -->
|
||||
<g font-size="10" fill="#4a4a4a" text-anchor="middle">
|
||||
<line x1="80" y1="380" x2="80" y2="385" stroke="#1f4e5a"/><text x="80" y="400">1750</text>
|
||||
<line x1="223.5" y1="380" x2="223.5" y2="385" stroke="#1f4e5a"/><text x="223.5" y="400">1800</text>
|
||||
<line x1="367" y1="380" x2="367" y2="385" stroke="#1f4e5a"/><text x="367" y="400">1850</text>
|
||||
<line x1="510" y1="380" x2="510" y2="385" stroke="#1f4e5a"/><text x="510" y="400">1900</text>
|
||||
<line x1="654" y1="380" x2="654" y2="385" stroke="#1f4e5a"/><text x="654" y="400">1950</text>
|
||||
<line x1="797" y1="380" x2="797" y2="385" stroke="#1f4e5a"/><text x="797" y="400">2000</text>
|
||||
<line x1="870" y1="380" x2="870" y2="385" stroke="#1f4e5a"/><text x="870" y="400">2024</text>
|
||||
</g>
|
||||
<text x="475" y="425" font-size="11" font-weight="700" fill="#1f4e5a" text-anchor="middle">Jahr</text>
|
||||
|
||||
<!-- Daten-Polyline (approximiert, Hauptstützpunkte aus Law Dome + NOAA) -->
|
||||
<!-- Year → ppm:
|
||||
1750→277, 1800→281, 1850→285, 1880→290, 1900→296, 1920→303,
|
||||
1940→311, 1958→315, 1970→326, 1980→339, 1990→354, 2000→370,
|
||||
2010→389, 2020→413, 2024→422
|
||||
x = 80 + (year-1750)*2.87 y = 380 - (ppm-250)*1.45 -->
|
||||
<polyline fill="url(#co2-fill)" stroke="none"
|
||||
points="80,380 80,340.85 223.5,335.05 367,329.25 453.1,321.95 510,314.65 567.4,308.85 624.8,301.55 676.46,297.75 710.86,284 739.44,266.05 768.03,239.4 796.61,206.95 825.19,173.05 853.77,143.5 870,141.9 870,380"/>
|
||||
<polyline fill="none" stroke="#c85c4a" stroke-width="2.5" stroke-linejoin="round"
|
||||
points="80,340.85 223.5,335.05 367,329.25 453.1,321.95 510,314.65 567.4,308.85 624.8,301.55 676.46,297.75 710.86,284 739.44,266.05 768.03,239.4 796.61,206.95 825.19,173.05 853.77,143.5 870,141.9"/>
|
||||
|
||||
<!-- Markante Punkte -->
|
||||
<g fill="#1f4e5a">
|
||||
<circle cx="80" cy="340.85" r="4"/>
|
||||
<text x="90" y="338" font-size="10" font-weight="700">1750 · 277 ppm</text>
|
||||
<circle cx="367" cy="329.25" r="4"/>
|
||||
<text x="377" y="326" font-size="10" font-weight="700">1850 · 285 ppm</text>
|
||||
<circle cx="676.46" cy="297.75" r="4"/>
|
||||
<text x="560" y="293" font-size="10" font-weight="700">1958 · 315 ppm (Mauna-Loa-Start)</text>
|
||||
<circle cx="870" cy="141.9" r="5" fill="#c85c4a"/>
|
||||
<text x="862" y="132" font-size="11" font-weight="800" fill="#c85c4a" text-anchor="end">2024 · 422 ppm</text>
|
||||
</g>
|
||||
|
||||
<!-- Vorindustriell-Band -->
|
||||
<rect x="80" y="329.25" width="790" height="22" fill="#5a8a5e" opacity=".12"/>
|
||||
<text x="86" y="346" font-size="9" fill="#3a6b3e" font-weight="700">Vorindustriell: 280 ppm</text>
|
||||
|
||||
<!-- Fußzeile -->
|
||||
<g transform="translate(50,430)">
|
||||
<text x="0" y="15" font-size="10" fill="#4a4a4a" font-weight="700">Quellen:</text>
|
||||
<text x="65" y="15" font-size="10" fill="#4a4a4a">NOAA Global Monitoring Lab (Mauna Loa Zeitreihe) · Etheridge et al. 1996 (Law Dome Eisbohrkern, CSIRO) · WMO Greenhouse Gas Bulletin 2023</text>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.3 MiB |
@@ -0,0 +1,104 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 900 480" font-family="Inter, system-ui, sans-serif" width="900" height="480">
|
||||
<text x="450" y="30" font-size="16" font-weight="800" fill="#1f4e5a" text-anchor="middle">
|
||||
Strommix Österreich 2023 — 84 % erneuerbar, aber im Gesamtenergiemix noch 62 % fossil
|
||||
</text>
|
||||
<text x="450" y="50" font-size="11" fill="#8a8a8a" text-anchor="middle">
|
||||
Anteile am Endverbrauch · Daten: E-Control · Statistik Austria
|
||||
</text>
|
||||
|
||||
<!-- ====== LINKS: Strom-Kuchen ====== -->
|
||||
<g transform="translate(230,260)">
|
||||
<text x="0" y="-140" font-size="14" font-weight="800" fill="#1f4e5a" text-anchor="middle">Strommix</text>
|
||||
<text x="0" y="-124" font-size="11" fill="#8a8a8a" text-anchor="middle">Bruttoinlandserzeugung 2023</text>
|
||||
|
||||
<!-- Kuchenstücke auf r=100 -->
|
||||
<!-- Reihenfolge startet oben (12 Uhr), im Uhrzeigersinn:
|
||||
Wasser 58%, Wind 11%, Biomasse 8%, PV 7%, Gas 10%, Sonstige 6% -->
|
||||
<!-- Mathematische Hilfe: Winkel in Grad, x = r*sin(a), y = -r*cos(a) -->
|
||||
<!-- Wasser: 0 → 208.8° -->
|
||||
<path d="M 0 0 L 0 -100 A 100 100 0 1 1 -48.17 87.63 Z" fill="#4a7c8a"/>
|
||||
<!-- Wind: 208.8 → 248.4° -->
|
||||
<path d="M 0 0 L -48.17 87.63 A 100 100 0 0 1 -92.99 36.81 Z" fill="#5a8a5e"/>
|
||||
<!-- Biomasse: 248.4 → 277.2° -->
|
||||
<path d="M 0 0 L -92.99 36.81 A 100 100 0 0 1 -99.20 -12.62 Z" fill="#3a6b3e"/>
|
||||
<!-- PV: 277.2 → 302.4° -->
|
||||
<path d="M 0 0 L -99.20 -12.62 A 100 100 0 0 1 -84.43 -53.58 Z" fill="#f4c94e"/>
|
||||
<!-- Gas: 302.4 → 338.4° -->
|
||||
<path d="M 0 0 L -84.43 -53.58 A 100 100 0 0 1 -36.81 -92.99 Z" fill="#c85c4a"/>
|
||||
<!-- Sonstige: 338.4 → 360° -->
|
||||
<path d="M 0 0 L -36.81 -92.99 A 100 100 0 0 1 0 -100 Z" fill="#c4a97a"/>
|
||||
|
||||
<!-- Zentrale Beschriftung -->
|
||||
<circle r="42" fill="#fff"/>
|
||||
<text y="-3" font-size="18" font-weight="900" fill="#1f4e5a" text-anchor="middle">84 %</text>
|
||||
<text y="14" font-size="9" font-weight="700" fill="#5a8a5e" text-anchor="middle">erneuerbar</text>
|
||||
|
||||
<!-- Segmentlabels -->
|
||||
<text x="55" y="-45" font-size="11" font-weight="800" fill="#fff" text-anchor="middle">58 %</text>
|
||||
<text x="55" y="-28" font-size="9" fill="#fff" text-anchor="middle">Wasser</text>
|
||||
<text x="-62" y="75" font-size="10" font-weight="800" fill="#fff" text-anchor="middle">11 %</text>
|
||||
<text x="-62" y="88" font-size="8" fill="#fff" text-anchor="middle">Wind</text>
|
||||
</g>
|
||||
|
||||
<!-- Legende rechts neben Kuchen -->
|
||||
<g transform="translate(370,160)" font-size="11">
|
||||
<g><rect x="0" y="0" width="14" height="14" fill="#4a7c8a"/><text x="22" y="11" fill="#1f4e5a" font-weight="700">Wasserkraft 58 %</text></g>
|
||||
<g transform="translate(0,22)"><rect width="14" height="14" fill="#5a8a5e"/><text x="22" y="11" fill="#1f4e5a" font-weight="700">Windenergie 11 %</text></g>
|
||||
<g transform="translate(0,44)"><rect width="14" height="14" fill="#3a6b3e"/><text x="22" y="11" fill="#1f4e5a" font-weight="700">Biomasse 8 %</text></g>
|
||||
<g transform="translate(0,66)"><rect width="14" height="14" fill="#f4c94e"/><text x="22" y="11" fill="#1f4e5a" font-weight="700">Photovoltaik 7 %</text></g>
|
||||
<g transform="translate(0,88)"><rect width="14" height="14" fill="#c85c4a"/><text x="22" y="11" fill="#1f4e5a" font-weight="700">Erdgas 10 %</text></g>
|
||||
<g transform="translate(0,110)"><rect width="14" height="14" fill="#c4a97a"/><text x="22" y="11" fill="#1f4e5a" font-weight="700">Sonstige 6 %</text></g>
|
||||
</g>
|
||||
|
||||
<!-- ====== RECHTS: Gesamtenergie-Balken (horizontal) ====== -->
|
||||
<g transform="translate(550,130)">
|
||||
<text x="0" y="0" font-size="14" font-weight="800" fill="#1f4e5a">Gesamtenergie 2023</text>
|
||||
<text x="0" y="16" font-size="11" fill="#8a8a8a">(Strom + Wärme + Verkehr)</text>
|
||||
|
||||
<!-- Balken 300 × 60 horizontal stacked, Anteile: Öl 36%, Gas 19%, Kohle 6%, EE 38%, Sonst 1% -->
|
||||
<!-- Gesamtbreite 300 px -->
|
||||
<g transform="translate(0,35)">
|
||||
<rect x="0" y="0" width="108" height="60" fill="#6b4a2e"/>
|
||||
<text x="54" y="28" font-size="12" font-weight="800" fill="#fff" text-anchor="middle">36 %</text>
|
||||
<text x="54" y="44" font-size="10" fill="#fff" text-anchor="middle">Erdöl</text>
|
||||
|
||||
<rect x="108" y="0" width="57" height="60" fill="#c85c4a"/>
|
||||
<text x="136" y="28" font-size="11" font-weight="800" fill="#fff" text-anchor="middle">19 %</text>
|
||||
<text x="136" y="42" font-size="9" fill="#fff" text-anchor="middle">Gas</text>
|
||||
|
||||
<rect x="165" y="0" width="18" height="60" fill="#1a1a1a"/>
|
||||
<text x="174" y="33" font-size="9" font-weight="800" fill="#fff" text-anchor="middle">6%</text>
|
||||
<text x="174" y="45" font-size="8" fill="#fff" text-anchor="middle">Kohle</text>
|
||||
|
||||
<rect x="183" y="0" width="114" height="60" fill="#5a8a5e"/>
|
||||
<text x="240" y="28" font-size="12" font-weight="800" fill="#fff" text-anchor="middle">38 %</text>
|
||||
<text x="240" y="44" font-size="10" fill="#fff" text-anchor="middle">Erneuerbar</text>
|
||||
|
||||
<rect x="297" y="0" width="3" height="60" fill="#c4a97a"/>
|
||||
</g>
|
||||
|
||||
<!-- Fossil-Klammer -->
|
||||
<path d="M 0 105 L 0 112 L 183 112 L 183 105" stroke="#c85c4a" stroke-width="1.5" fill="none"/>
|
||||
<text x="91.5" y="128" font-size="11" font-weight="800" fill="#c85c4a" text-anchor="middle">fossil 61 %</text>
|
||||
<path d="M 183 105 L 183 112 L 297 112 L 297 105" stroke="#5a8a5e" stroke-width="1.5" fill="none"/>
|
||||
<text x="240" y="128" font-size="11" font-weight="800" fill="#5a8a5e" text-anchor="middle">erneuerbar 38 %</text>
|
||||
|
||||
<!-- Mini-Vergleich Verkehr -->
|
||||
<text x="0" y="175" font-size="12" font-weight="800" fill="#1f4e5a">Im Verkehr dominieren Benzin & Diesel:</text>
|
||||
<g transform="translate(0,185)">
|
||||
<rect x="0" y="0" width="280" height="14" fill="#6b4a2e"/>
|
||||
<rect x="280" y="0" width="20" height="14" fill="#5a8a5e"/>
|
||||
<text x="140" y="10" font-size="9" fill="#fff" font-weight="800" text-anchor="middle">über 93 % fossil</text>
|
||||
<text x="295" y="28" font-size="9" fill="#5a8a5e" font-weight="700" text-anchor="end">7 % erneuerbar (Strom + Bio)</text>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<!-- Footer -->
|
||||
<g transform="translate(50,420)">
|
||||
<rect x="0" y="0" width="800" height="50" rx="4" fill="#fff" stroke="#dae8ec"/>
|
||||
<text x="12" y="16" font-size="10" font-weight="800" fill="#1f4e5a">Ziel Österreich:</text>
|
||||
<text x="130" y="16" font-size="10" fill="#4a4a4a">100 % erneuerbarer Strom bis 2030 (EAG) · Klimaneutralität bis 2040.</text>
|
||||
<text x="12" y="32" font-size="10" font-weight="800" fill="#1f4e5a">Quellen:</text>
|
||||
<text x="70" y="32" font-size="10" fill="#4a4a4a">E-Control, Betriebsstatistik Strom 2023 · Statistik Austria, Energiebilanz 2023 · BMK, Energiestatus 2024</text>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 6.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.5 MiB |
@@ -0,0 +1,137 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 900 420" font-family="Inter, system-ui, sans-serif" width="900" height="420">
|
||||
<defs>
|
||||
<pattern id="fb-rock" width="8" height="8" patternUnits="userSpaceOnUse">
|
||||
<rect width="8" height="8" fill="#6b4a2e"/>
|
||||
<circle cx="3" cy="3" r=".7" fill="#4a2f1a"/>
|
||||
<circle cx="6" cy="6" r=".6" fill="#8a6a4a"/>
|
||||
</pattern>
|
||||
<linearGradient id="fb-flame" x1="0" y1="0" x2="0" y2="1">
|
||||
<stop offset="0" stop-color="#f4c94e"/>
|
||||
<stop offset=".6" stop-color="#e8833a"/>
|
||||
<stop offset="1" stop-color="#c85c4a"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
|
||||
<text x="450" y="30" font-size="16" font-weight="800" fill="#1f4e5a" text-anchor="middle">
|
||||
Fossile Brennstoffe — 300 Millionen Jahre Speicherung, Sekunden Verbrennung
|
||||
</text>
|
||||
|
||||
<!-- Zeitachse: 300 Mio Jahre als Balken -->
|
||||
<g transform="translate(50, 90)">
|
||||
<!-- Balken (Geschichte der Erde) -->
|
||||
<rect x="0" y="0" width="800" height="42" fill="#4a7c8a" rx="3"/>
|
||||
<rect x="0" y="0" width="800" height="42" fill="none" stroke="#1f4e5a" stroke-width="1.5" rx="3"/>
|
||||
|
||||
<!-- Karbon-Zeitalter (Entstehung der Kohle) -->
|
||||
<rect x="0" y="0" width="120" height="42" fill="#3a6b3e" rx="3"/>
|
||||
<text x="60" y="25" font-size="10" font-weight="800" fill="#fff" text-anchor="middle">Karbon</text>
|
||||
|
||||
<!-- Dinosaurier -->
|
||||
<circle cx="260" cy="21" r="3" fill="#fff"/>
|
||||
<text x="260" y="58" font-size="8" fill="#4a4a4a" text-anchor="middle">Dinosaurier</text>
|
||||
<text x="260" y="68" font-size="8" fill="#8a8a8a" text-anchor="middle">vor 200 Mio J.</text>
|
||||
|
||||
<!-- Säugetiere -->
|
||||
<circle cx="620" cy="21" r="3" fill="#fff"/>
|
||||
<text x="620" y="58" font-size="8" fill="#4a4a4a" text-anchor="middle">Säugetiere</text>
|
||||
|
||||
<!-- Menschheit (ganz am Ende) -->
|
||||
<rect x="795" y="-6" width="5" height="54" fill="#c85c4a"/>
|
||||
<text x="790" y="-10" font-size="10" fill="#c85c4a" font-weight="800" text-anchor="end">Homo sapiens</text>
|
||||
<text x="790" y="-22" font-size="9" fill="#8a8a8a" text-anchor="end">(letzte 300.000 Jahre)</text>
|
||||
|
||||
<!-- Achsen-Labels -->
|
||||
<text x="0" y="80" font-size="10" fill="#1f4e5a" font-weight="700">vor 350 Mio Jahren</text>
|
||||
<text x="800" y="80" font-size="10" fill="#1f4e5a" font-weight="700" text-anchor="end">heute</text>
|
||||
|
||||
<text x="400" y="-18" font-size="11" fill="#1f4e5a" font-weight="800" text-anchor="middle">Zeitachse: 350 Millionen Jahre</text>
|
||||
|
||||
<!-- Pfeil runter zur Entstehung -->
|
||||
<path d="M 60 42 L 60 105" stroke="#3a6b3e" stroke-width="1.5" marker-end="url(#fb-a-green)" fill="none" stroke-dasharray="3 2"/>
|
||||
</g>
|
||||
|
||||
<!-- Entstehung der Kohle (links) -->
|
||||
<g transform="translate(110, 240)">
|
||||
<text y="-10" font-size="12" font-weight="800" fill="#3a6b3e" text-anchor="middle">Über Millionen Jahre:</text>
|
||||
<!-- Pflanzen -->
|
||||
<g>
|
||||
<polygon points="-40,-5 -35,-25 -30,-5" fill="#5a8a5e"/>
|
||||
<polygon points="-25,-5 -20,-30 -15,-5" fill="#3a6b3e"/>
|
||||
<polygon points="-10,-5 -5,-28 0,-5" fill="#5a8a5e"/>
|
||||
<polygon points="5,-5 10,-25 15,-5" fill="#3a6b3e"/>
|
||||
<polygon points="20,-5 25,-30 30,-5" fill="#5a8a5e"/>
|
||||
<rect x="-50" y="-5" width="100" height="6" fill="#6b4a2e"/>
|
||||
</g>
|
||||
<!-- Pfeil nach unten -->
|
||||
<path d="M 0 5 L 0 35" stroke="#6b4a2e" stroke-width="2" fill="none"/>
|
||||
<polygon points="-4,30 4,30 0,40" fill="#6b4a2e"/>
|
||||
<!-- Schichten (Gestein) -->
|
||||
<rect x="-60" y="45" width="120" height="10" fill="#e8d5b5"/>
|
||||
<rect x="-60" y="55" width="120" height="10" fill="#c4a97a"/>
|
||||
<rect x="-60" y="65" width="120" height="15" fill="url(#fb-rock)"/>
|
||||
<!-- Kohle-Flöz -->
|
||||
<rect x="-60" y="80" width="120" height="10" fill="#1a1a1a"/>
|
||||
<text y="103" font-size="11" fill="#1f4e5a" font-weight="700" text-anchor="middle">Kohle-Flöz</text>
|
||||
<text y="118" font-size="9" fill="#8a8a8a" text-anchor="middle">(gepresste Urwälder)</text>
|
||||
</g>
|
||||
|
||||
<!-- Pfeil: Entstehung dauert lange -->
|
||||
<g>
|
||||
<path d="M 230 280 L 380 280" stroke="#4a7c8a" stroke-width="2" fill="none" stroke-dasharray="6 4"/>
|
||||
<polygon points="380,280 370,275 370,285" fill="#4a7c8a"/>
|
||||
<text x="305" y="272" font-size="11" fill="#4a7c8a" font-weight="700" text-anchor="middle">~300.000.000 Jahre</text>
|
||||
<text x="305" y="295" font-size="9" fill="#8a8a8a" text-anchor="middle">Druck · Wärme · kein Sauerstoff</text>
|
||||
</g>
|
||||
|
||||
<!-- Verbrennung (Mitte-Rechts) -->
|
||||
<g transform="translate(510, 260)">
|
||||
<text y="-25" font-size="12" font-weight="800" fill="#c85c4a" text-anchor="middle">Heute in Sekunden:</text>
|
||||
<!-- Schornstein / Feuerstelle -->
|
||||
<rect x="-20" y="-5" width="40" height="45" fill="#4a4a4a"/>
|
||||
<rect x="-25" y="-10" width="50" height="8" fill="#2a2a2a"/>
|
||||
<!-- Flamme -->
|
||||
<path d="M -15 -10 Q -20 -35 -10 -55 Q 0 -40 5 -60 Q 15 -35 20 -45 Q 15 -20 -15 -10 Z" fill="url(#fb-flame)"/>
|
||||
<!-- Rauch: CO₂-Wölkchen -->
|
||||
<g fill="#c85c4a" opacity=".75">
|
||||
<circle cx="-5" cy="-75" r="7"/>
|
||||
<circle cx="8" cy="-82" r="9"/>
|
||||
<circle cx="20" cy="-75" r="6"/>
|
||||
<circle cx="12" cy="-95" r="7"/>
|
||||
</g>
|
||||
<text x="10" y="-72" font-size="7" font-weight="800" fill="#fff">CO₂</text>
|
||||
|
||||
<text y="60" font-size="11" fill="#1f4e5a" font-weight="700" text-anchor="middle">Verbrennung</text>
|
||||
<text y="76" font-size="9" fill="#8a8a8a" text-anchor="middle">setzt in Sekunden frei,</text>
|
||||
<text y="89" font-size="9" fill="#8a8a8a" text-anchor="middle">was in Jahrmillionen</text>
|
||||
<text y="102" font-size="9" fill="#8a8a8a" text-anchor="middle">gebunden wurde.</text>
|
||||
</g>
|
||||
|
||||
<!-- Mahnungs-Pfeil: Ungleichgewicht -->
|
||||
<g>
|
||||
<path d="M 600 280 L 760 280" stroke="#c85c4a" stroke-width="3" fill="none" marker-end="url(#fb-red)"/>
|
||||
</g>
|
||||
<defs>
|
||||
<marker id="fb-red" viewBox="0 0 10 10" refX="8" refY="5" markerWidth="5" markerHeight="5" orient="auto">
|
||||
<path d="M 0 0 L 10 5 L 0 10 z" fill="#c85c4a"/>
|
||||
</marker>
|
||||
<marker id="fb-a-green" viewBox="0 0 10 10" refX="8" refY="5" markerWidth="4" markerHeight="4" orient="auto">
|
||||
<path d="M 0 0 L 10 5 L 0 10 z" fill="#3a6b3e"/>
|
||||
</marker>
|
||||
</defs>
|
||||
|
||||
<!-- CO₂-Block rechts -->
|
||||
<g transform="translate(820, 240)">
|
||||
<circle r="35" fill="#c85c4a"/>
|
||||
<text y="-3" font-size="18" font-weight="900" fill="#fff" text-anchor="middle">CO₂</text>
|
||||
<text y="15" font-size="9" fill="#fff" text-anchor="middle">ansteigend</text>
|
||||
</g>
|
||||
|
||||
<!-- Footer Vergleiche -->
|
||||
<g transform="translate(0, 370)">
|
||||
<rect x="50" y="0" width="800" height="40" rx="6" fill="#fff" stroke="#dae8ec" stroke-width="1"/>
|
||||
<text x="70" y="16" font-size="10" fill="#1f4e5a" font-weight="800">Zum Einordnen:</text>
|
||||
<text x="155" y="16" font-size="10" fill="#4a4a4a">1 Liter Benzin = Energie aus ≈ 25 t Urzeit-Pflanzenmaterial · 75 % der weltweiten CO₂-Emissionen aus Fossilen</text>
|
||||
<text x="70" y="32" font-size="10" fill="#1f4e5a" font-weight="800">In Österreich:</text>
|
||||
<text x="155" y="32" font-size="10" fill="#4a4a4a">jährlich ca. 8 Mio. Tonnen Erdöl — vor allem für den Verkehr (Diesel, Benzin, Kerosin)</text>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 7.0 KiB |
@@ -0,0 +1,133 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 900 500" font-family="Inter, system-ui, sans-serif" width="900" height="500">
|
||||
<defs>
|
||||
<marker id="fs-arr-in" viewBox="0 0 10 10" refX="8" refY="5" markerWidth="6" markerHeight="6" orient="auto">
|
||||
<path d="M 0 0 L 10 5 L 0 10 z" fill="#4a7c8a"/>
|
||||
</marker>
|
||||
<marker id="fs-arr-out" viewBox="0 0 10 10" refX="8" refY="5" markerWidth="6" markerHeight="6" orient="auto">
|
||||
<path d="M 0 0 L 10 5 L 0 10 z" fill="#3a6b3e"/>
|
||||
</marker>
|
||||
<marker id="fs-arr-light" viewBox="0 0 10 10" refX="8" refY="5" markerWidth="6" markerHeight="6" orient="auto">
|
||||
<path d="M 0 0 L 10 5 L 0 10 z" fill="#e8833a"/>
|
||||
</marker>
|
||||
<linearGradient id="fs-leaf" x1="0" y1="0" x2="0" y2="1">
|
||||
<stop offset="0" stop-color="#5a8a5e"/>
|
||||
<stop offset="1" stop-color="#3a6b3e"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
|
||||
<text x="450" y="30" font-size="16" font-weight="800" fill="#1f4e5a" text-anchor="middle">
|
||||
Fotosynthese — wie Pflanzen aus Licht Nahrung machen
|
||||
</text>
|
||||
<text x="450" y="50" font-size="11" fill="#8a8a8a" text-anchor="middle">
|
||||
Grundlage aller Nahrungsketten · produziert den Sauerstoff unserer Atmosphäre
|
||||
</text>
|
||||
|
||||
<!-- Sonne oben links -->
|
||||
<g>
|
||||
<circle cx="130" cy="130" r="38" fill="#f4c94e"/>
|
||||
<g stroke="#f4c94e" stroke-width="2">
|
||||
<line x1="130" y1="75" x2="130" y2="60"/>
|
||||
<line x1="130" y1="185" x2="130" y2="200"/>
|
||||
<line x1="75" y1="130" x2="60" y2="130"/>
|
||||
<line x1="185" y1="130" x2="200" y2="130"/>
|
||||
<line x1="95" y1="95" x2="82" y2="82"/>
|
||||
<line x1="165" y1="95" x2="178" y2="82"/>
|
||||
<line x1="95" y1="165" x2="82" y2="178"/>
|
||||
<line x1="165" y1="165" x2="178" y2="178"/>
|
||||
</g>
|
||||
<text x="130" y="135" font-size="22" text-anchor="middle">☀</text>
|
||||
<text x="130" y="220" font-size="12" font-weight="700" fill="#e8833a" text-anchor="middle">Sonnenlicht</text>
|
||||
</g>
|
||||
|
||||
<!-- Lichtstrahl zum Blatt -->
|
||||
<line x1="165" y1="160" x2="360" y2="260" stroke="#e8833a" stroke-width="2.5" marker-end="url(#fs-arr-light)"/>
|
||||
|
||||
<!-- CO₂-Moleküle links unten -->
|
||||
<g transform="translate(90,340)">
|
||||
<text x="0" y="-30" font-size="12" font-weight="700" fill="#4a7c8a">CO₂ aus der Luft</text>
|
||||
<g>
|
||||
<circle cx="0" cy="0" r="14" fill="#c85c4a"/>
|
||||
<text x="0" y="4" font-size="10" font-weight="800" fill="#fff" text-anchor="middle">CO₂</text>
|
||||
</g>
|
||||
<g transform="translate(40,15)">
|
||||
<circle cx="0" cy="0" r="14" fill="#c85c4a"/>
|
||||
<text x="0" y="4" font-size="10" font-weight="800" fill="#fff" text-anchor="middle">CO₂</text>
|
||||
</g>
|
||||
<g transform="translate(5,40)">
|
||||
<circle cx="0" cy="0" r="14" fill="#c85c4a"/>
|
||||
<text x="0" y="4" font-size="10" font-weight="800" fill="#fff" text-anchor="middle">CO₂</text>
|
||||
</g>
|
||||
</g>
|
||||
<line x1="155" y1="340" x2="330" y2="290" stroke="#4a7c8a" stroke-width="2" marker-end="url(#fs-arr-in)"/>
|
||||
|
||||
<!-- H₂O-Moleküle unten -->
|
||||
<g transform="translate(200,430)">
|
||||
<text x="0" y="-20" font-size="12" font-weight="700" fill="#4a7c8a">H₂O aus dem Boden</text>
|
||||
<g>
|
||||
<circle cx="0" cy="0" r="14" fill="#4a7c8a"/>
|
||||
<text x="0" y="4" font-size="9" font-weight="800" fill="#fff" text-anchor="middle">H₂O</text>
|
||||
</g>
|
||||
<g transform="translate(35,10)">
|
||||
<circle cx="0" cy="0" r="14" fill="#4a7c8a"/>
|
||||
<text x="0" y="4" font-size="9" font-weight="800" fill="#fff" text-anchor="middle">H₂O</text>
|
||||
</g>
|
||||
</g>
|
||||
<line x1="250" y1="410" x2="390" y2="330" stroke="#4a7c8a" stroke-width="2" marker-end="url(#fs-arr-in)"/>
|
||||
|
||||
<!-- ZENTRUM: Blatt/Pflanze -->
|
||||
<g transform="translate(450,280)">
|
||||
<!-- Blattform -->
|
||||
<path d="M 0 -80 Q 80 -70 90 0 Q 80 70 0 80 Q -80 70 -90 0 Q -80 -70 0 -80 Z" fill="url(#fs-leaf)"/>
|
||||
<!-- Blattader -->
|
||||
<line x1="0" y1="-80" x2="0" y2="80" stroke="#1f4e5a" stroke-width="1.5" opacity=".5"/>
|
||||
<g stroke="#1f4e5a" stroke-width=".8" opacity=".4">
|
||||
<path d="M 0 -60 Q 30 -55 50 -30" fill="none"/>
|
||||
<path d="M 0 -30 Q 40 -25 60 0" fill="none"/>
|
||||
<path d="M 0 0 Q 40 5 60 30" fill="none"/>
|
||||
<path d="M 0 30 Q 30 35 50 55" fill="none"/>
|
||||
<path d="M 0 -60 Q -30 -55 -50 -30" fill="none"/>
|
||||
<path d="M 0 -30 Q -40 -25 -60 0" fill="none"/>
|
||||
<path d="M 0 0 Q -40 5 -60 30" fill="none"/>
|
||||
<path d="M 0 30 Q -30 35 -50 55" fill="none"/>
|
||||
</g>
|
||||
<text y="5" font-size="16" font-weight="900" fill="#fff" text-anchor="middle">Chloroplast</text>
|
||||
</g>
|
||||
|
||||
<!-- Reaktionsformel darunter -->
|
||||
<g transform="translate(450,410)">
|
||||
<rect x="-220" y="-20" width="440" height="44" rx="6" fill="#fff" stroke="#dae8ec"/>
|
||||
<text y="3" font-size="14" font-weight="800" fill="#1f4e5a" text-anchor="middle">6 CO₂ + 6 H₂O + Licht → C₆H₁₂O₆ + 6 O₂</text>
|
||||
<text y="18" font-size="10" fill="#8a8a8a" text-anchor="middle">Kohlenstoffdioxid + Wasser + Sonnenenergie werden zu Zucker (Glukose) + Sauerstoff</text>
|
||||
</g>
|
||||
|
||||
<!-- O₂ rechts oben raus -->
|
||||
<line x1="540" y1="240" x2="760" y2="170" stroke="#3a6b3e" stroke-width="2.5" marker-end="url(#fs-arr-out)"/>
|
||||
<g transform="translate(780,160)">
|
||||
<text x="0" y="-20" font-size="12" font-weight="700" fill="#3a6b3e" text-anchor="middle">Sauerstoff O₂</text>
|
||||
<g>
|
||||
<circle cx="-25" cy="0" r="14" fill="#5a8a5e"/>
|
||||
<text x="-25" y="4" font-size="10" font-weight="800" fill="#fff" text-anchor="middle">O₂</text>
|
||||
</g>
|
||||
<g>
|
||||
<circle cx="15" cy="10" r="14" fill="#5a8a5e"/>
|
||||
<text x="15" y="14" font-size="10" font-weight="800" fill="#fff" text-anchor="middle">O₂</text>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<!-- Glukose als Zucker-Icon rechts mitte -->
|
||||
<line x1="540" y1="310" x2="760" y2="360" stroke="#e8833a" stroke-width="2.5" marker-end="url(#fs-arr-out)"/>
|
||||
<g transform="translate(800,370)">
|
||||
<text x="0" y="-20" font-size="12" font-weight="700" fill="#c4a97a" text-anchor="middle">Zucker</text>
|
||||
<rect x="-30" y="-10" width="60" height="30" rx="4" fill="#e8d5b5" stroke="#c4a97a"/>
|
||||
<text x="0" y="10" font-size="11" font-weight="800" fill="#8a6a2a" text-anchor="middle">C₆H₁₂O₆</text>
|
||||
</g>
|
||||
|
||||
<!-- Footer Fakten -->
|
||||
<g transform="translate(50,450)">
|
||||
<rect x="0" y="0" width="800" height="40" rx="4" fill="#fff" stroke="#dae8ec"/>
|
||||
<text x="12" y="16" font-size="10" font-weight="800" fill="#1f4e5a">Pro Jahr weltweit:</text>
|
||||
<text x="130" y="16" font-size="10" fill="#4a4a4a">Landpflanzen binden ≈ 120 Gt Kohlenstoff · Phytoplankton im Meer liefert rund die Hälfte des Luft-Sauerstoffs.</text>
|
||||
<text x="12" y="32" font-size="10" font-weight="800" fill="#1f4e5a">Quelle:</text>
|
||||
<text x="65" y="32" font-size="10" fill="#4a4a4a">IPCC AR6 WG1, Kap. 5 · Campbell / Reece, Biology 11e · Friedlingstein et al. 2023 (Global Carbon Budget)</text>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 6.7 KiB |
@@ -0,0 +1,125 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 900 480" font-family="Inter, system-ui, sans-serif" width="900" height="480">
|
||||
<text x="450" y="28" font-size="16" font-weight="800" fill="#1f4e5a" text-anchor="middle">
|
||||
Kipppunkt — wenn eine Veränderung nicht mehr umzudrehen ist
|
||||
</text>
|
||||
<text x="450" y="46" font-size="11" fill="#8a8a8a" text-anchor="middle">
|
||||
Didaktische Metapher + 8 der 16 bekannten Kippelemente im Klimasystem
|
||||
</text>
|
||||
|
||||
<!-- LINKS: Tisch-Metapher in drei Phasen -->
|
||||
<g transform="translate(30,90)">
|
||||
<text x="180" y="0" font-size="13" font-weight="800" fill="#1f4e5a" text-anchor="middle">So funktioniert ein Kipppunkt</text>
|
||||
|
||||
<!-- Phase 1 -->
|
||||
<g transform="translate(0,20)">
|
||||
<rect x="0" y="80" width="100" height="6" fill="#8a8a8a"/>
|
||||
<rect x="5" y="86" width="4" height="30" fill="#8a8a8a"/>
|
||||
<rect x="91" y="86" width="4" height="30" fill="#8a8a8a"/>
|
||||
<circle cx="30" cy="72" r="10" fill="#5a8a5e"/>
|
||||
<text x="50" y="135" font-size="10" font-weight="700" fill="#3a6b3e" text-anchor="middle">1. Stabil</text>
|
||||
<text x="50" y="148" font-size="9" fill="#8a8a8a" text-anchor="middle">kleine Störungen</text>
|
||||
<text x="50" y="159" font-size="9" fill="#8a8a8a" text-anchor="middle">schieben zurück</text>
|
||||
</g>
|
||||
|
||||
<!-- Phase 2 -->
|
||||
<g transform="translate(120,20)">
|
||||
<rect x="0" y="80" width="100" height="6" fill="#8a8a8a"/>
|
||||
<rect x="5" y="86" width="4" height="30" fill="#8a8a8a"/>
|
||||
<rect x="91" y="86" width="4" height="30" fill="#8a8a8a"/>
|
||||
<circle cx="88" cy="72" r="10" fill="#e8833a"/>
|
||||
<text x="88" y="55" font-size="14" font-weight="900" fill="#e8833a" text-anchor="middle">⚠</text>
|
||||
<text x="50" y="135" font-size="10" font-weight="700" fill="#e8833a" text-anchor="middle">2. Am Rand</text>
|
||||
<text x="50" y="148" font-size="9" fill="#8a8a8a" text-anchor="middle">kritische Schwelle</text>
|
||||
<text x="50" y="159" font-size="9" fill="#8a8a8a" text-anchor="middle">fast erreicht</text>
|
||||
</g>
|
||||
|
||||
<!-- Phase 3 -->
|
||||
<g transform="translate(240,20)">
|
||||
<rect x="0" y="80" width="100" height="6" fill="#8a8a8a"/>
|
||||
<rect x="5" y="86" width="4" height="30" fill="#8a8a8a"/>
|
||||
<rect x="91" y="86" width="4" height="30" fill="#8a8a8a"/>
|
||||
<circle cx="115" cy="130" r="10" fill="#c85c4a"/>
|
||||
<!-- Fallbahn -->
|
||||
<path d="M 95 75 Q 110 105 115 120" stroke="#c85c4a" stroke-width="1.2" fill="none" stroke-dasharray="3 2"/>
|
||||
<text x="50" y="135" font-size="10" font-weight="700" fill="#c85c4a" text-anchor="middle">3. Gekippt</text>
|
||||
<text x="50" y="148" font-size="9" fill="#8a8a8a" text-anchor="middle">unumkehrbar —</text>
|
||||
<text x="50" y="159" font-size="9" fill="#8a8a8a" text-anchor="middle">neuer Zustand</text>
|
||||
</g>
|
||||
|
||||
<!-- Erklärung unten -->
|
||||
<g transform="translate(0,200)">
|
||||
<rect x="0" y="0" width="360" height="62" rx="4" fill="#fff" stroke="#dae8ec"/>
|
||||
<text x="10" y="17" font-size="10" font-weight="800" fill="#1f4e5a">Übertragen aufs Klimasystem:</text>
|
||||
<text x="10" y="32" font-size="10" fill="#4a4a4a">Steigt die globale Temperatur über eine kritische</text>
|
||||
<text x="10" y="44" font-size="10" fill="#4a4a4a">Schwelle, verändert sich ein Teil der Erde</text>
|
||||
<text x="10" y="56" font-size="10" fill="#4a4a4a">selbstverstärkend — auch ohne weitere Erwärmung.</text>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<!-- RECHTS: Kippelemente-Liste auf stilisierter Welt -->
|
||||
<g transform="translate(430,80)">
|
||||
<text x="220" y="0" font-size="13" font-weight="800" fill="#1f4e5a" text-anchor="middle">16 Kippelemente — ab welcher Erwärmung kritisch</text>
|
||||
|
||||
<!-- Vereinfachte Weltkarte als farbiger Hintergrund (Ellipsen statt Kontinente) -->
|
||||
<g transform="translate(0,20)">
|
||||
<rect x="0" y="0" width="440" height="180" rx="6" fill="#eff5f6"/>
|
||||
|
||||
<!-- Grönland -->
|
||||
<ellipse cx="205" cy="40" rx="18" ry="22" fill="#dae8ec" stroke="#4a7c8a" stroke-width=".5"/>
|
||||
<circle cx="205" cy="40" r="6" fill="#c85c4a"/>
|
||||
<text x="205" y="22" font-size="9" font-weight="700" fill="#c85c4a" text-anchor="middle">Grönland-Eisschild</text>
|
||||
<text x="205" y="78" font-size="9" fill="#c85c4a" text-anchor="middle">ab 1,5 °C</text>
|
||||
|
||||
<!-- West-Antarktis -->
|
||||
<ellipse cx="220" cy="160" rx="42" ry="12" fill="#dae8ec" stroke="#4a7c8a" stroke-width=".5"/>
|
||||
<circle cx="200" cy="160" r="5" fill="#c85c4a"/>
|
||||
<text x="220" y="176" font-size="9" font-weight="700" fill="#c85c4a" text-anchor="middle">West-Antarktis · ab 1,5 °C</text>
|
||||
|
||||
<!-- AMOC Nordatlantik -->
|
||||
<circle cx="170" cy="60" r="5" fill="#e8833a"/>
|
||||
<text x="110" y="58" font-size="9" font-weight="700" fill="#e8833a" text-anchor="middle">AMOC-Umwälzung</text>
|
||||
<text x="110" y="69" font-size="9" fill="#e8833a" text-anchor="middle">1,4 – 8 °C</text>
|
||||
|
||||
<!-- Permafrost Sibirien -->
|
||||
<circle cx="310" cy="50" r="5" fill="#e8833a"/>
|
||||
<text x="360" y="48" font-size="9" font-weight="700" fill="#e8833a" text-anchor="middle">Permafrost</text>
|
||||
<text x="360" y="59" font-size="9" fill="#e8833a" text-anchor="middle">1,0 – 2,3 °C</text>
|
||||
|
||||
<!-- Amazonas -->
|
||||
<circle cx="160" cy="110" r="5" fill="#c85c4a"/>
|
||||
<text x="100" y="108" font-size="9" font-weight="700" fill="#c85c4a" text-anchor="middle">Amazonas-Regenwald</text>
|
||||
<text x="100" y="119" font-size="9" fill="#c85c4a" text-anchor="middle">3,5 °C</text>
|
||||
|
||||
<!-- Korallenriffe trop. -->
|
||||
<circle cx="330" cy="105" r="5" fill="#c85c4a"/>
|
||||
<text x="385" y="103" font-size="9" font-weight="700" fill="#c85c4a" text-anchor="middle">Korallenriffe</text>
|
||||
<text x="385" y="114" font-size="9" fill="#c85c4a" text-anchor="middle">1,0 – 1,5 °C</text>
|
||||
|
||||
<!-- Boreale Wälder -->
|
||||
<circle cx="290" cy="75" r="5" fill="#e8833a"/>
|
||||
<text x="345" y="75" font-size="9" font-weight="700" fill="#e8833a" text-anchor="middle">Boreale Wälder</text>
|
||||
<text x="345" y="86" font-size="9" fill="#e8833a" text-anchor="middle">1,5 – 5 °C</text>
|
||||
|
||||
<!-- Westafrik. Monsun -->
|
||||
<circle cx="225" cy="120" r="5" fill="#e8833a"/>
|
||||
<text x="220" y="140" font-size="9" font-weight="700" fill="#e8833a" text-anchor="middle">Sahel-Monsun</text>
|
||||
<text x="220" y="151" font-size="9" fill="#e8833a" text-anchor="middle">2,0 – 3,5 °C</text>
|
||||
</g>
|
||||
|
||||
<!-- Legende -->
|
||||
<g transform="translate(0,215)">
|
||||
<circle cx="10" cy="6" r="5" fill="#c85c4a"/>
|
||||
<text x="22" y="10" font-size="10" fill="#1f4e5a" font-weight="700">Schwelle liegt nahe am heutigen Erwärmungsniveau (+ 1,2 °C)</text>
|
||||
<circle cx="10" cy="25" r="5" fill="#e8833a"/>
|
||||
<text x="22" y="29" font-size="10" fill="#1f4e5a" font-weight="700">Schwelle bei stärkerer Erwärmung erreichbar</text>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<!-- Footer -->
|
||||
<g transform="translate(50,430)">
|
||||
<rect x="0" y="0" width="800" height="40" rx="4" fill="#fff" stroke="#dae8ec"/>
|
||||
<text x="12" y="16" font-size="10" font-weight="800" fill="#1f4e5a">Quellen:</text>
|
||||
<text x="70" y="16" font-size="10" fill="#4a4a4a">Armstrong McKay, D. et al. (2022): Exceeding 1.5 °C global warming could trigger multiple climate tipping points. Science 377, eabn7950.</text>
|
||||
<text x="70" y="32" font-size="10" fill="#4a4a4a">IPCC AR6 WG1 (2021), Kap. 9 · PIK Potsdam-Institut für Klimafolgenforschung.</text>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 7.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.2 MiB |
@@ -0,0 +1,64 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 900 480" font-family="Inter, system-ui, sans-serif" width="900" height="480">
|
||||
<text x="450" y="30" font-size="16" font-weight="800" fill="#1f4e5a" text-anchor="middle">
|
||||
Erderwärmung — Österreich steigt rund 2,6-mal schneller als der globale Mittelwert
|
||||
</text>
|
||||
<text x="450" y="50" font-size="11" fill="#8a8a8a" text-anchor="middle">
|
||||
Temperaturabweichung vom Mittel 1961–1990 · Datenstand 2023
|
||||
</text>
|
||||
|
||||
<!-- Plot: x 80..870, y 90..390. X: 1900..2024 = 124 a in 790 px → 6,37 px/a -->
|
||||
<line x1="80" y1="390" x2="870" y2="390" stroke="#1f4e5a" stroke-width="1.5"/>
|
||||
<line x1="80" y1="90" x2="80" y2="390" stroke="#1f4e5a" stroke-width="1.5"/>
|
||||
|
||||
<!-- 0°C Bezugslinie (mitte y=290) -->
|
||||
<!-- Y-Range: -0,5 bis +3,5 = 4°C auf 300 px → 75 px/°C. y(T)=290 - T*75 -->
|
||||
<line x1="80" y1="290" x2="870" y2="290" stroke="#1f4e5a" stroke-width="1" stroke-dasharray="3 2"/>
|
||||
<text x="875" y="293" font-size="10" fill="#1f4e5a" font-weight="700">0 °C (Referenz)</text>
|
||||
|
||||
<g font-size="10" fill="#4a4a4a" text-anchor="end">
|
||||
<line x1="80" y1="365" x2="870" y2="365" stroke="#dae8ec" stroke-width=".5"/><text x="74" y="368">−0,5</text>
|
||||
<line x1="80" y1="215" x2="870" y2="215" stroke="#dae8ec" stroke-width=".5"/><text x="74" y="218">+1,0</text>
|
||||
<line x1="80" y1="140" x2="870" y2="140" stroke="#dae8ec" stroke-width=".5"/><text x="74" y="143">+2,0</text>
|
||||
<line x1="80" y1="90" x2="870" y2="90" stroke="#dae8ec" stroke-width=".5"/><text x="74" y="93">+2,7</text>
|
||||
</g>
|
||||
<text x="22" y="240" font-size="11" font-weight="700" fill="#1f4e5a" text-anchor="middle" transform="rotate(-90 22 240)">Temperaturabweichung (°C)</text>
|
||||
|
||||
<!-- X-Achse 1900..2020 Grid -->
|
||||
<g font-size="10" fill="#4a4a4a" text-anchor="middle">
|
||||
<line x1="80" y1="390" x2="80" y2="395" stroke="#1f4e5a"/><text x="80" y="410">1900</text>
|
||||
<line x1="207.4" y1="390" x2="207.4" y2="395" stroke="#1f4e5a"/><text x="207.4" y="410">1920</text>
|
||||
<line x1="334.8" y1="390" x2="334.8" y2="395" stroke="#1f4e5a"/><text x="334.8" y="410">1940</text>
|
||||
<line x1="462.2" y1="390" x2="462.2" y2="395" stroke="#1f4e5a"/><text x="462.2" y="410">1960</text>
|
||||
<line x1="589.6" y1="390" x2="589.6" y2="395" stroke="#1f4e5a"/><text x="589.6" y="410">1980</text>
|
||||
<line x1="717" y1="390" x2="717" y2="395" stroke="#1f4e5a"/><text x="717" y="410">2000</text>
|
||||
<line x1="844.4" y1="390" x2="844.4" y2="395" stroke="#1f4e5a"/><text x="844.4" y="410">2020</text>
|
||||
</g>
|
||||
|
||||
<!-- Globale Kurve (HadCRUT5-artig, vereinfacht): y = 290 - T*75 -->
|
||||
<!-- Stützstellen (Jahr/Anomalie °C): 1900:-0.2, 1920:-0.25, 1940:-0.1, 1960:-0.05, 1980:0.15, 2000:0.4, 2020:1.02, 2023:1.17 -->
|
||||
<polyline fill="none" stroke="#4a7c8a" stroke-width="2.2" stroke-linejoin="round"
|
||||
points="80,305 207.4,308.75 334.8,297.5 462.2,293.75 589.6,278.75 717,260 844.4,213.5 864,202.25"/>
|
||||
<text x="870" y="199" font-size="11" font-weight="800" fill="#4a7c8a">Welt</text>
|
||||
<text x="870" y="212" font-size="10" fill="#4a7c8a">+1,2 °C (2023)</text>
|
||||
|
||||
<!-- AT Kurve (GeoSphere-artig, Jahr/°C): 1900:-0.5, 1920:-0.2, 1940:0.25, 1960:-0.05, 1980:0.25, 2000:1.3, 2020:2.4, 2023:2.6 -->
|
||||
<polyline fill="none" stroke="#c85c4a" stroke-width="2.5" stroke-linejoin="round"
|
||||
points="80,327.5 207.4,305 334.8,271.25 462.2,293.75 589.6,271.25 717,192.5 844.4,110 864,95"/>
|
||||
<text x="870" y="92" font-size="11" font-weight="800" fill="#c85c4a">Österreich</text>
|
||||
<text x="870" y="105" font-size="10" fill="#c85c4a">+3,1 °C (2023)</text>
|
||||
|
||||
<!-- Pariser Zielzonen -->
|
||||
<rect x="80" y="178.75" width="790" height="6" fill="#e8833a" opacity=".35"/>
|
||||
<text x="86" y="176" font-size="9" fill="#e8833a" font-weight="700">Pariser Ziel: unter +1,5 °C</text>
|
||||
<rect x="80" y="140" width="790" height="6" fill="#c85c4a" opacity=".25"/>
|
||||
<text x="86" y="137" font-size="9" fill="#c85c4a" font-weight="700">Pariser Schwelle: unter +2,0 °C</text>
|
||||
|
||||
<!-- Fußzeile -->
|
||||
<g transform="translate(50,435)">
|
||||
<rect x="0" y="0" width="800" height="35" rx="4" fill="#fff" stroke="#dae8ec"/>
|
||||
<text x="12" y="15" font-size="10" fill="#1f4e5a" font-weight="700">Lesehilfe:</text>
|
||||
<text x="70" y="15" font-size="10" fill="#4a4a4a">Die Kurve zeigt, wie stark die Jahresdurchschnitts-Temperatur gegenüber dem Mittel 1961–1990 gestiegen ist.</text>
|
||||
<text x="12" y="30" font-size="10" fill="#1f4e5a" font-weight="700">Quellen:</text>
|
||||
<text x="70" y="30" font-size="10" fill="#4a4a4a">Met Office HadCRUT5 (global) · GeoSphere Austria, Klimastatusbericht 2023 (Österreich)</text>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.5 KiB |
@@ -0,0 +1,76 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 900 540" font-family="Inter, system-ui, sans-serif" width="900" height="540">
|
||||
<defs>
|
||||
<marker id="kk-arr-nat" viewBox="0 0 10 10" refX="8" refY="5" markerWidth="6" markerHeight="6" orient="auto">
|
||||
<path d="M 0 0 L 10 5 L 0 10 z" fill="#3a6b3e"/>
|
||||
</marker>
|
||||
<marker id="kk-arr-h" viewBox="0 0 10 10" refX="8" refY="5" markerWidth="6" markerHeight="6" orient="auto">
|
||||
<path d="M 0 0 L 10 5 L 0 10 z" fill="#c85c4a"/>
|
||||
</marker>
|
||||
</defs>
|
||||
|
||||
<text x="450" y="30" font-size="16" font-weight="800" fill="#1f4e5a" text-anchor="middle">
|
||||
Der Kohlenstoffkreislauf — so wandert Kohlenstoff zwischen Erde, Luft und Meer
|
||||
</text>
|
||||
<text x="450" y="50" font-size="11" fill="#8a8a8a" text-anchor="middle">
|
||||
Reservoire in Gigatonnen Kohlenstoff (Gt C) · Flüsse als Pfeile · Stand 2022
|
||||
</text>
|
||||
|
||||
<!-- Reservoire: Atmosphäre oben, Landpflanzen/Böden Mitte, Ozeane rechts unten, Fossile links unten -->
|
||||
|
||||
<!-- Atmosphäre (oben) -->
|
||||
<rect x="300" y="80" width="300" height="70" rx="8" fill="#4a7c8a"/>
|
||||
<text x="450" y="110" font-size="15" font-weight="900" fill="#fff" text-anchor="middle">Atmosphäre</text>
|
||||
<text x="450" y="130" font-size="14" font-weight="700" fill="#fff" text-anchor="middle">≈ 875 Gt C (als CO₂)</text>
|
||||
|
||||
<!-- Landpflanzen & Böden (Mitte links) -->
|
||||
<rect x="80" y="250" width="270" height="80" rx="8" fill="#5a8a5e"/>
|
||||
<text x="215" y="278" font-size="14" font-weight="900" fill="#fff" text-anchor="middle">Landpflanzen + Böden</text>
|
||||
<text x="215" y="296" font-size="12" fill="#dcead0" text-anchor="middle">Wälder, Wiesen, Moore</text>
|
||||
<text x="215" y="316" font-size="14" font-weight="700" fill="#fff" text-anchor="middle">≈ 2.300 Gt C</text>
|
||||
|
||||
<!-- Ozeane (Mitte rechts) -->
|
||||
<rect x="550" y="250" width="270" height="80" rx="8" fill="#1f4e5a"/>
|
||||
<text x="685" y="278" font-size="14" font-weight="900" fill="#fff" text-anchor="middle">Ozeane</text>
|
||||
<text x="685" y="296" font-size="12" fill="#dae8ec" text-anchor="middle">größtes aktives Reservoir</text>
|
||||
<text x="685" y="316" font-size="14" font-weight="700" fill="#fff" text-anchor="middle">≈ 38.000 Gt C</text>
|
||||
|
||||
<!-- Fossile Lagerstätten (unten) -->
|
||||
<rect x="300" y="410" width="300" height="70" rx="8" fill="#6b4a2e"/>
|
||||
<text x="450" y="438" font-size="14" font-weight="900" fill="#fff" text-anchor="middle">Fossile Lagerstätten</text>
|
||||
<text x="450" y="458" font-size="12" fill="#e8d5b5" text-anchor="middle">Kohle, Erdöl, Erdgas — rund 4.000 Gt C</text>
|
||||
|
||||
<!-- Natürliche Flüsse (grün) -->
|
||||
<!-- Fotosynthese: Atmosphäre → Landpflanzen -->
|
||||
<path d="M 370 150 Q 300 195 240 250" stroke="#3a6b3e" stroke-width="2" fill="none" marker-end="url(#kk-arr-nat)"/>
|
||||
<text x="245" y="195" font-size="10" font-weight="700" fill="#3a6b3e" text-anchor="middle">Fotosynthese</text>
|
||||
<text x="245" y="207" font-size="9" fill="#3a6b3e" text-anchor="middle">≈ 120 Gt C/Jahr</text>
|
||||
|
||||
<!-- Atmung & Verwesung: Landpflanzen → Atmosphäre -->
|
||||
<path d="M 310 250 Q 330 195 410 150" stroke="#3a6b3e" stroke-width="2" fill="none" marker-end="url(#kk-arr-nat)"/>
|
||||
<text x="400" y="195" font-size="10" font-weight="700" fill="#3a6b3e" text-anchor="middle">Atmung + Verwesung</text>
|
||||
<text x="400" y="207" font-size="9" fill="#3a6b3e" text-anchor="middle">≈ 118 Gt C/Jahr</text>
|
||||
|
||||
<!-- Ozean ↔ Atmosphäre (bidirektional) -->
|
||||
<path d="M 540 150 Q 600 195 645 250" stroke="#3a6b3e" stroke-width="2" fill="none" marker-end="url(#kk-arr-nat)"/>
|
||||
<path d="M 685 250 Q 650 195 570 150" stroke="#3a6b3e" stroke-width="2" fill="none" marker-end="url(#kk-arr-nat)"/>
|
||||
<text x="680" y="195" font-size="10" font-weight="700" fill="#3a6b3e" text-anchor="middle">CO₂-Austausch Meer</text>
|
||||
<text x="680" y="207" font-size="9" fill="#3a6b3e" text-anchor="middle">je ca. 80 Gt C/Jahr</text>
|
||||
|
||||
<!-- Menschlicher Fluss (rot): Fossile → Atmosphäre -->
|
||||
<path d="M 440 410 Q 420 280 430 150" stroke="#c85c4a" stroke-width="3" fill="none" marker-end="url(#kk-arr-h)"/>
|
||||
<rect x="110" y="365" width="230" height="30" rx="4" fill="#f0d0ca"/>
|
||||
<text x="225" y="384" font-size="10" font-weight="800" fill="#c85c4a" text-anchor="middle">Verbrennung fossiler Energie + Landnutzung</text>
|
||||
<!-- Pfeil zu Beschriftung -->
|
||||
<line x1="340" y1="380" x2="420" y2="380" stroke="#c85c4a" stroke-width="1.2" stroke-dasharray="3 2"/>
|
||||
<text x="465" y="285" font-size="11" font-weight="800" fill="#c85c4a" text-anchor="middle">+ 10,9 Gt C/Jahr</text>
|
||||
<text x="465" y="298" font-size="10" fill="#c85c4a" text-anchor="middle">= 40,6 Gt CO₂</text>
|
||||
|
||||
<!-- Natürliche Senken nehmen rund die Hälfte auf -->
|
||||
<g transform="translate(80,495)">
|
||||
<rect x="0" y="0" width="760" height="35" rx="4" fill="#fff" stroke="#dae8ec"/>
|
||||
<text x="12" y="15" font-size="10" font-weight="800" fill="#1f4e5a">So reagiert der Kreislauf:</text>
|
||||
<text x="155" y="15" font-size="10" fill="#4a4a4a">Landpflanzen + Ozeane nehmen ca. 55 % der menschgemachten Emissionen auf; der Rest bleibt in der Luft.</text>
|
||||
<text x="12" y="30" font-size="10" font-weight="800" fill="#1f4e5a">Quelle:</text>
|
||||
<text x="65" y="30" font-size="10" fill="#4a4a4a">Friedlingstein et al. (2023), Global Carbon Budget 2023 · IPCC AR6 WG1, Kapitel 5</text>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 5.2 KiB |
@@ -0,0 +1,93 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 900 460" font-family="Inter, system-ui, sans-serif" width="900" height="460">
|
||||
<defs>
|
||||
<linearGradient id="kw-kwh" x1="0" y1="0" x2="1" y2="0">
|
||||
<stop offset="0" stop-color="#f4c94e"/>
|
||||
<stop offset="1" stop-color="#e8833a"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
|
||||
<text x="450" y="32" font-size="16" font-weight="800" fill="#1f4e5a" text-anchor="middle">
|
||||
1 Kilowattstunde (kWh) — was kannst du damit machen?
|
||||
</text>
|
||||
<text x="450" y="52" font-size="11" fill="#8a8a8a" text-anchor="middle">
|
||||
Eine kWh kostet in Österreich rund 25 Cent. Alle Zahlen gerundet.
|
||||
</text>
|
||||
|
||||
<!-- Zentrale "1 kWh" Scheibe -->
|
||||
<g transform="translate(450, 225)">
|
||||
<circle r="62" fill="url(#kw-kwh)"/>
|
||||
<circle r="62" fill="none" stroke="#1f4e5a" stroke-width="2.5"/>
|
||||
<text y="-4" font-size="28" font-weight="900" fill="#1f4e5a" text-anchor="middle">1</text>
|
||||
<text y="22" font-size="13" font-weight="800" fill="#1f4e5a" text-anchor="middle">kWh</text>
|
||||
</g>
|
||||
|
||||
<!-- 6 Vergleiche um das Zentrum -->
|
||||
<!-- Positionen (x, y) für die Karten -->
|
||||
<!-- Oben links: Wäsche -->
|
||||
<g transform="translate(160, 110)">
|
||||
<rect x="-90" y="-45" width="180" height="90" rx="10" fill="#fff" stroke="#dae8ec" stroke-width="1.5"/>
|
||||
<text y="-22" font-size="28" text-anchor="middle">🧺</text>
|
||||
<text y="3" font-size="13" font-weight="800" fill="#1f4e5a" text-anchor="middle">1 Maschine Wäsche</text>
|
||||
<text y="22" font-size="10" fill="#8a8a8a" text-anchor="middle">waschen (60 °C)</text>
|
||||
<text y="36" font-size="9" fill="#5a8a5e" text-anchor="middle" font-weight="600">≈ 1 kWh</text>
|
||||
</g>
|
||||
<!-- Oben rechts: Fernsehen -->
|
||||
<g transform="translate(740, 110)">
|
||||
<rect x="-90" y="-45" width="180" height="90" rx="10" fill="#fff" stroke="#dae8ec" stroke-width="1.5"/>
|
||||
<text y="-22" font-size="28" text-anchor="middle">📺</text>
|
||||
<text y="3" font-size="13" font-weight="800" fill="#1f4e5a" text-anchor="middle">7 Stunden TV</text>
|
||||
<text y="22" font-size="10" fill="#8a8a8a" text-anchor="middle">moderner 55"-Fernseher</text>
|
||||
<text y="36" font-size="9" fill="#5a8a5e" text-anchor="middle" font-weight="600">140 W × 7 h</text>
|
||||
</g>
|
||||
<!-- Mitte links: E-Auto -->
|
||||
<g transform="translate(130, 225)">
|
||||
<rect x="-85" y="-45" width="170" height="90" rx="10" fill="#fff" stroke="#dae8ec" stroke-width="1.5"/>
|
||||
<text y="-22" font-size="28" text-anchor="middle">🚗</text>
|
||||
<text y="3" font-size="13" font-weight="800" fill="#1f4e5a" text-anchor="middle">7 km E-Auto</text>
|
||||
<text y="22" font-size="10" fill="#8a8a8a" text-anchor="middle">Wien → Grinzing</text>
|
||||
<text y="36" font-size="9" fill="#5a8a5e" text-anchor="middle" font-weight="600">15 kWh / 100 km</text>
|
||||
</g>
|
||||
<!-- Mitte rechts: Smartphone -->
|
||||
<g transform="translate(770, 225)">
|
||||
<rect x="-85" y="-45" width="170" height="90" rx="10" fill="#fff" stroke="#dae8ec" stroke-width="1.5"/>
|
||||
<text y="-22" font-size="28" text-anchor="middle">📱</text>
|
||||
<text y="3" font-size="13" font-weight="800" fill="#1f4e5a" text-anchor="middle">65 × Smartphone</text>
|
||||
<text y="22" font-size="10" fill="#8a8a8a" text-anchor="middle">voll aufladen</text>
|
||||
<text y="36" font-size="9" fill="#5a8a5e" text-anchor="middle" font-weight="600">15 Wh pro Ladung</text>
|
||||
</g>
|
||||
<!-- Unten links: Kochen -->
|
||||
<g transform="translate(160, 340)">
|
||||
<rect x="-90" y="-45" width="180" height="90" rx="10" fill="#fff" stroke="#dae8ec" stroke-width="1.5"/>
|
||||
<text y="-22" font-size="28" text-anchor="middle">🍝</text>
|
||||
<text y="3" font-size="13" font-weight="800" fill="#1f4e5a" text-anchor="middle">30 min Herdplatte</text>
|
||||
<text y="22" font-size="10" fill="#8a8a8a" text-anchor="middle">Nudeln kochen</text>
|
||||
<text y="36" font-size="9" fill="#5a8a5e" text-anchor="middle" font-weight="600">2.000 W × 0,5 h</text>
|
||||
</g>
|
||||
<!-- Unten rechts: Kaffee -->
|
||||
<g transform="translate(740, 340)">
|
||||
<rect x="-90" y="-45" width="180" height="90" rx="10" fill="#fff" stroke="#dae8ec" stroke-width="1.5"/>
|
||||
<text y="-22" font-size="28" text-anchor="middle">☕</text>
|
||||
<text y="3" font-size="13" font-weight="800" fill="#1f4e5a" text-anchor="middle">90 Tassen Kaffee</text>
|
||||
<text y="22" font-size="10" fill="#8a8a8a" text-anchor="middle">aus der Siebträgermaschine</text>
|
||||
<text y="36" font-size="9" fill="#5a8a5e" text-anchor="middle" font-weight="600">11 Wh pro Tasse</text>
|
||||
</g>
|
||||
|
||||
<!-- Linien vom Zentrum zu den Karten -->
|
||||
<g stroke="#4a7c8a" stroke-width="1" stroke-dasharray="3 3" opacity=".5">
|
||||
<line x1="400" y1="210" x2="260" y2="130"/>
|
||||
<line x1="500" y1="210" x2="640" y2="130"/>
|
||||
<line x1="388" y1="225" x2="215" y2="225"/>
|
||||
<line x1="512" y1="225" x2="685" y2="225"/>
|
||||
<line x1="400" y1="240" x2="260" y2="320"/>
|
||||
<line x1="500" y1="240" x2="640" y2="320"/>
|
||||
</g>
|
||||
|
||||
<!-- Footer-Vergleich -->
|
||||
<g transform="translate(0, 410)">
|
||||
<rect x="50" y="0" width="800" height="40" rx="6" fill="#fff" stroke="#dae8ec" stroke-width="1"/>
|
||||
<text x="70" y="16" font-size="10" fill="#1f4e5a" font-weight="800">Jahresverbrauch:</text>
|
||||
<text x="180" y="16" font-size="10" fill="#4a4a4a">Einfamilienhaus ≈ 4.000 kWh · Tesla Model 3 Akku = 75 kWh · Österreich gesamt ≈ 70.000.000.000 kWh</text>
|
||||
<text x="70" y="32" font-size="10" fill="#1f4e5a" font-weight="800">Solardach:</text>
|
||||
<text x="180" y="32" font-size="10" fill="#4a4a4a">1 m² Photovoltaik liefert in Österreich ca. 150–180 kWh pro Jahr — 30 m² decken einen Haushalt.</text>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 5.5 KiB |
@@ -0,0 +1,47 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 900 420" font-family="Inter, system-ui, sans-serif" width="900" height="420">
|
||||
<text x="450" y="30" font-size="16" font-weight="800" fill="#1f4e5a" text-anchor="middle">
|
||||
Methan — kurzlebig, aber in der Wirkung viel stärker als CO₂
|
||||
</text>
|
||||
<text x="450" y="50" font-size="11" fill="#8a8a8a" text-anchor="middle">
|
||||
Treibhauspotenzial GWP 20 und GWP 100 nach IPCC AR6 (2021) · 1 kg des Gases im Vergleich
|
||||
</text>
|
||||
|
||||
<!-- Drei Balken: 1 kg CO₂ (1), 1 kg CH4 GWP-100 (28), 1 kg CH4 GWP-20 (82) -->
|
||||
<!-- Skala: 82 ≙ max 600 px. 1 Einheit = 7,32 px -->
|
||||
<g font-size="12">
|
||||
<!-- CO₂ -->
|
||||
<g transform="translate(100,110)">
|
||||
<text x="0" y="-8" font-weight="800" fill="#1f4e5a">1 kg CO₂</text>
|
||||
<text x="600" y="-8" font-size="11" fill="#8a8a8a" text-anchor="end">Referenz: 1 × CO₂eq</text>
|
||||
<rect x="0" y="0" width="7.32" height="38" fill="#4a7c8a"/>
|
||||
<text x="15" y="25" font-size="14" font-weight="800" fill="#1f4e5a">= 1 kg CO₂eq</text>
|
||||
</g>
|
||||
<!-- Methan GWP-100 -->
|
||||
<g transform="translate(100,180)">
|
||||
<text x="0" y="-8" font-weight="800" fill="#c85c4a">1 kg Methan (CH₄) — auf 100 Jahre</text>
|
||||
<text x="600" y="-8" font-size="11" fill="#8a8a8a" text-anchor="end">GWP-100 = 28</text>
|
||||
<rect x="0" y="0" width="205" height="38" fill="#c85c4a"/>
|
||||
<text x="215" y="25" font-size="14" font-weight="800" fill="#c85c4a">= 28 kg CO₂eq</text>
|
||||
</g>
|
||||
<!-- Methan GWP-20 -->
|
||||
<g transform="translate(100,250)">
|
||||
<text x="0" y="-8" font-weight="800" fill="#e8833a">1 kg Methan (CH₄) — auf 20 Jahre</text>
|
||||
<text x="600" y="-8" font-size="11" fill="#8a8a8a" text-anchor="end">GWP-20 = 82</text>
|
||||
<rect x="0" y="0" width="600" height="38" fill="#e8833a"/>
|
||||
<text x="300" y="25" font-size="14" font-weight="800" fill="#fff" text-anchor="middle">= 82 kg CO₂eq</text>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<!-- Hinweis -->
|
||||
<g transform="translate(100,310)">
|
||||
<rect x="0" y="0" width="700" height="42" rx="4" fill="#fff" stroke="#dae8ec"/>
|
||||
<text x="12" y="17" font-size="10.5" font-weight="800" fill="#1f4e5a">Warum zwei Zahlen?</text>
|
||||
<text x="12" y="34" font-size="10.5" fill="#4a4a4a">Methan zerfällt in der Luft im Mittel nach 12 Jahren. Kurzfristig (20 Jahre) wirkt es deshalb viel stärker als langfristig (100 Jahre).</text>
|
||||
</g>
|
||||
|
||||
<!-- Fußzeile Quellen -->
|
||||
<g transform="translate(100,370)">
|
||||
<text x="0" y="0" font-size="10" font-weight="800" fill="#1f4e5a">Quelle:</text>
|
||||
<text x="50" y="0" font-size="10" fill="#4a4a4a">IPCC AR6 WG1 (2021), Tabelle 7.15 · NOAA Methan-Konzentration 2023: 1.929 ppb</text>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.8 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.8 MiB |
@@ -0,0 +1,107 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 900 460" font-family="Inter, system-ui, sans-serif" width="900" height="460">
|
||||
<text x="450" y="30" font-size="16" font-weight="800" fill="#1f4e5a" text-anchor="middle">
|
||||
Permafrost — 14 Millionen km² auf der Nordhalbkugel
|
||||
</text>
|
||||
<text x="450" y="50" font-size="11" fill="#8a8a8a" text-anchor="middle">
|
||||
Nördliche Halbkugel + Bodenquerschnitt · Datengrundlage IPA Permafrost Map 2020
|
||||
</text>
|
||||
|
||||
<!-- LINKS: Polansicht Nordhalbkugel -->
|
||||
<g transform="translate(60,80)">
|
||||
<text x="170" y="0" font-size="13" font-weight="800" fill="#1f4e5a" text-anchor="middle">Verbreitung Nordhalbkugel</text>
|
||||
|
||||
<!-- Polar-Projektion als Kreis -->
|
||||
<circle cx="170" cy="170" r="150" fill="#eff5f6" stroke="#4a7c8a" stroke-width="1.5"/>
|
||||
|
||||
<!-- Permafrost-Zonen (schematisch): kontinuierlich innen, diskontinuierlich außen -->
|
||||
<!-- Kontinuierlicher Permafrost (innen) -->
|
||||
<circle cx="170" cy="170" r="80" fill="#c85c4a" fill-opacity=".55"/>
|
||||
<!-- Diskontinuierlich -->
|
||||
<path d="M 170 170 m -115 0 a 115 115 0 1 0 230 0 a 115 115 0 1 0 -230 0 Z M 170 170 m -80 0 a 80 80 0 1 1 160 0 a 80 80 0 1 1 -160 0 Z"
|
||||
fill="#e8833a" fill-opacity=".5" fill-rule="evenodd"/>
|
||||
<!-- Sporadisch außen -->
|
||||
<path d="M 170 170 m -145 0 a 145 145 0 1 0 290 0 a 145 145 0 1 0 -290 0 Z M 170 170 m -115 0 a 115 115 0 1 1 230 0 a 115 115 0 1 1 -230 0 Z"
|
||||
fill="#c4a97a" fill-opacity=".4" fill-rule="evenodd"/>
|
||||
|
||||
<!-- Pol-Stern -->
|
||||
<text x="170" y="175" font-size="14" font-weight="900" fill="#1f4e5a" text-anchor="middle">✦</text>
|
||||
<text x="170" y="188" font-size="8" fill="#1f4e5a" text-anchor="middle">Nordpol</text>
|
||||
|
||||
<!-- Grobe Kontinentumrisse -->
|
||||
<g fill="none" stroke="#3a6b3e" stroke-width="1.5">
|
||||
<!-- Grönland -->
|
||||
<path d="M 140 85 Q 160 75 175 90 Q 172 110 155 115 Q 140 105 140 85 Z"/>
|
||||
<!-- Sibirien (Ost) -->
|
||||
<path d="M 230 130 Q 280 115 300 150 Q 310 180 290 195 Q 250 185 230 170 Z"/>
|
||||
<!-- Nord-Amerika/Kanada/Alaska -->
|
||||
<path d="M 60 160 Q 80 130 130 140 Q 140 170 110 190 Q 80 190 60 160 Z"/>
|
||||
<!-- Europa klein -->
|
||||
<path d="M 175 220 Q 200 215 210 240 Q 195 250 175 245 Z"/>
|
||||
</g>
|
||||
|
||||
<!-- Alpen-Markierung -->
|
||||
<circle cx="185" cy="236" r="3" fill="#1f4e5a"/>
|
||||
<line x1="185" y1="236" x2="240" y2="270" stroke="#1f4e5a" stroke-width=".8"/>
|
||||
<text x="245" y="274" font-size="9" font-weight="700" fill="#1f4e5a">Alpen (ab ~2.500 m)</text>
|
||||
|
||||
<!-- Legende -->
|
||||
<g transform="translate(0,340)">
|
||||
<g><rect width="12" height="12" fill="#c85c4a" fill-opacity=".55"/><text x="18" y="10" font-size="10" fill="#1f4e5a">kontinuierlich</text></g>
|
||||
<g transform="translate(105,0)"><rect width="12" height="12" fill="#e8833a" fill-opacity=".5"/><text x="18" y="10" font-size="10" fill="#1f4e5a">diskontinuierlich</text></g>
|
||||
<g transform="translate(225,0)"><rect width="12" height="12" fill="#c4a97a" fill-opacity=".4"/><text x="18" y="10" font-size="10" fill="#1f4e5a">sporadisch</text></g>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<!-- RECHTS: Bodenquerschnitt -->
|
||||
<g transform="translate(500,80)">
|
||||
<text x="170" y="0" font-size="13" font-weight="800" fill="#1f4e5a" text-anchor="middle">Bodenquerschnitt</text>
|
||||
|
||||
<!-- Luft oben -->
|
||||
<rect x="0" y="15" width="340" height="30" fill="#eff5f6"/>
|
||||
<text x="10" y="35" font-size="10" fill="#8a8a8a">Luft</text>
|
||||
|
||||
<!-- Aktive Schicht (taut im Sommer) -->
|
||||
<rect x="0" y="45" width="340" height="30" fill="#c4a97a"/>
|
||||
<text x="170" y="65" font-size="10" font-weight="700" fill="#fff" text-anchor="middle">aktive Schicht (30–150 cm)</text>
|
||||
<text x="345" y="61" font-size="9" fill="#8a6a2a">taut im Sommer</text>
|
||||
|
||||
<!-- Permafrost -->
|
||||
<rect x="0" y="75" width="340" height="200" fill="#4a7c8a"/>
|
||||
<!-- Eis-Einschlüsse -->
|
||||
<g fill="#dae8ec" opacity=".7">
|
||||
<circle cx="50" cy="120" r="5"/>
|
||||
<circle cx="120" cy="150" r="6"/>
|
||||
<circle cx="220" cy="130" r="4"/>
|
||||
<circle cx="280" cy="170" r="7"/>
|
||||
<circle cx="80" cy="200" r="5"/>
|
||||
<circle cx="180" cy="220" r="6"/>
|
||||
<circle cx="300" cy="250" r="5"/>
|
||||
<circle cx="140" cy="260" r="4"/>
|
||||
</g>
|
||||
<text x="170" y="180" font-size="13" font-weight="900" fill="#fff" text-anchor="middle">Permafrost</text>
|
||||
<text x="170" y="198" font-size="10" fill="#dae8ec" text-anchor="middle">dauerhaft ≤ 0 °C</text>
|
||||
<text x="170" y="215" font-size="10" fill="#dae8ec" text-anchor="middle">stellenweise bis 1.500 m tief</text>
|
||||
|
||||
<!-- Organische Substanz markiert -->
|
||||
<g>
|
||||
<path d="M 15 100 L 20 95 L 25 100 L 30 95" stroke="#c85c4a" stroke-width="1.5" fill="none" opacity=".7"/>
|
||||
<path d="M 100 175 L 105 170 L 110 175 L 115 170" stroke="#c85c4a" stroke-width="1.5" fill="none" opacity=".7"/>
|
||||
<path d="M 230 225 L 235 220 L 240 225 L 245 220" stroke="#c85c4a" stroke-width="1.5" fill="none" opacity=".7"/>
|
||||
</g>
|
||||
<text x="345" y="180" font-size="9" fill="#c85c4a" font-weight="700">organische</text>
|
||||
<text x="345" y="192" font-size="9" fill="#c85c4a" font-weight="700">Reste · ≈ 1.500 Gt</text>
|
||||
<text x="345" y="204" font-size="9" fill="#c85c4a">Kohlenstoff</text>
|
||||
|
||||
<!-- Klammer rechts -->
|
||||
<path d="M 340 75 L 345 75 L 345 275 L 340 275" fill="none" stroke="#c85c4a" stroke-width="1"/>
|
||||
</g>
|
||||
|
||||
<!-- Footer -->
|
||||
<g transform="translate(50,405)">
|
||||
<rect x="0" y="0" width="800" height="42" rx="4" fill="#fff" stroke="#dae8ec"/>
|
||||
<text x="12" y="17" font-size="10" font-weight="800" fill="#1f4e5a">Warum wichtig:</text>
|
||||
<text x="110" y="17" font-size="10" fill="#4a4a4a">Taut der Permafrost auf, wird organisches Material abgebaut — CO₂ und Methan gelangen in die Atmosphäre (Kipppunkt).</text>
|
||||
<text x="12" y="33" font-size="10" font-weight="800" fill="#1f4e5a">Quellen:</text>
|
||||
<text x="70" y="33" font-size="10" fill="#4a4a4a">International Permafrost Association (2020): Permafrost Map · Schuur et al. (2022): Permafrost and Climate Change · IPCC AR6 WG1, Kap. 9</text>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 6.0 KiB |
@@ -0,0 +1,109 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 900 480" font-family="Inter, system-ui, sans-serif" width="900" height="480">
|
||||
<defs>
|
||||
<marker id="pv-arr" viewBox="0 0 10 10" refX="8" refY="5" markerWidth="5" markerHeight="5" orient="auto">
|
||||
<path d="M 0 0 L 10 5 L 0 10 z" fill="#e8833a"/>
|
||||
</marker>
|
||||
<marker id="pv-e" viewBox="0 0 10 10" refX="8" refY="5" markerWidth="5" markerHeight="5" orient="auto">
|
||||
<path d="M 0 0 L 10 5 L 0 10 z" fill="#4a7c8a"/>
|
||||
</marker>
|
||||
</defs>
|
||||
|
||||
<text x="450" y="30" font-size="16" font-weight="800" fill="#1f4e5a" text-anchor="middle">
|
||||
Photovoltaik — Sonnenlicht wird direkt in Strom verwandelt
|
||||
</text>
|
||||
<text x="450" y="50" font-size="11" fill="#8a8a8a" text-anchor="middle">
|
||||
Aufbau einer Silizium-Solarzelle · Wirkungsgrad heutiger Module 20–23 %
|
||||
</text>
|
||||
|
||||
<!-- LINKS: Solarzellen-Querschnitt -->
|
||||
<g transform="translate(60,100)">
|
||||
<text x="180" y="0" font-size="14" font-weight="800" fill="#1f4e5a" text-anchor="middle">So funktioniert eine Solarzelle</text>
|
||||
|
||||
<!-- Sonne + Lichtstrahlen -->
|
||||
<circle cx="40" cy="40" r="22" fill="#f4c94e"/>
|
||||
<text x="40" y="46" font-size="14" font-weight="900" fill="#1f4e5a" text-anchor="middle">☀</text>
|
||||
<g stroke="#e8833a" stroke-width="2" fill="none" marker-end="url(#pv-arr)">
|
||||
<line x1="70" y1="55" x2="130" y2="120"/>
|
||||
<line x1="90" y1="55" x2="170" y2="120"/>
|
||||
<line x1="110" y1="55" x2="210" y2="120"/>
|
||||
<line x1="130" y1="55" x2="250" y2="120"/>
|
||||
<line x1="150" y1="55" x2="290" y2="120"/>
|
||||
</g>
|
||||
|
||||
<!-- Zell-Querschnitt -->
|
||||
<rect x="80" y="125" width="260" height="12" fill="#8a8a8a"/>
|
||||
<text x="350" y="134" font-size="9" fill="#8a8a8a">Anti-Reflex-Schicht</text>
|
||||
<rect x="80" y="137" width="260" height="26" fill="#4a7c8a"/>
|
||||
<text x="350" y="155" font-size="9" fill="#4a7c8a" font-weight="700">n-Silizium</text>
|
||||
<rect x="80" y="163" width="260" height="26" fill="#3a6470"/>
|
||||
<text x="350" y="181" font-size="9" fill="#3a6470" font-weight="700">p-Silizium</text>
|
||||
<rect x="80" y="189" width="260" height="10" fill="#1a1a1a"/>
|
||||
<text x="350" y="198" font-size="9" fill="#1a1a1a">Rück-Kontakt</text>
|
||||
|
||||
<!-- Übergangslinie markieren -->
|
||||
<line x1="80" y1="163" x2="340" y2="163" stroke="#c85c4a" stroke-width="1" stroke-dasharray="3 2"/>
|
||||
<text x="210" y="178" font-size="9" font-weight="700" fill="#c85c4a" text-anchor="middle">p-n-Übergang</text>
|
||||
|
||||
<!-- Elektronen-Pfeil -->
|
||||
<path d="M 210 150 L 210 220 L 20 220 L 20 150" stroke="#4a7c8a" stroke-width="2" fill="none" marker-end="url(#pv-e)"/>
|
||||
<circle cx="20" cy="180" r="8" fill="#4a7c8a"/>
|
||||
<text x="20" y="184" font-size="11" font-weight="900" fill="#fff" text-anchor="middle">e⁻</text>
|
||||
<text x="10" y="258" font-size="10" fill="#4a7c8a" font-weight="700">Elektronen fließen</text>
|
||||
<text x="10" y="271" font-size="10" fill="#4a7c8a" font-weight="700">als Strom</text>
|
||||
|
||||
<!-- Lampe anschließen -->
|
||||
<circle cx="210" cy="260" r="18" fill="none" stroke="#c4a97a" stroke-width="2"/>
|
||||
<line x1="210" y1="248" x2="210" y2="254" stroke="#1f4e5a" stroke-width="1"/>
|
||||
<path d="M 200 258 L 220 258" stroke="#1f4e5a" stroke-width="1" fill="none"/>
|
||||
<circle cx="210" cy="260" r="6" fill="#f4c94e"/>
|
||||
<text x="210" y="293" font-size="9" fill="#8a8a8a" text-anchor="middle">Verbraucher</text>
|
||||
</g>
|
||||
|
||||
<!-- RECHTS: Ertrag-Vergleich -->
|
||||
<g transform="translate(520,100)">
|
||||
<text x="160" y="0" font-size="14" font-weight="800" fill="#1f4e5a" text-anchor="middle">Was liefert 1 m² Dachfläche?</text>
|
||||
<text x="160" y="15" font-size="10" fill="#8a8a8a" text-anchor="middle">in Österreich, nach Süden ausgerichtet</text>
|
||||
|
||||
<!-- Haus mit Solardach -->
|
||||
<g transform="translate(20,40)">
|
||||
<rect x="0" y="60" width="100" height="60" fill="#e8d5b5" stroke="#1f4e5a" stroke-width="1"/>
|
||||
<polygon points="-6,60 50,15 106,60" fill="#4a7c8a" stroke="#1f4e5a" stroke-width="1"/>
|
||||
<!-- PV-Module -->
|
||||
<g>
|
||||
<rect x="8" y="21" width="18" height="22" fill="#1f4e5a" stroke="#4a7c8a" stroke-width=".5" transform="skewX(-38)"/>
|
||||
<rect x="30" y="21" width="18" height="22" fill="#1f4e5a" stroke="#4a7c8a" stroke-width=".5" transform="skewX(-38)"/>
|
||||
<rect x="52" y="21" width="18" height="22" fill="#1f4e5a" stroke="#4a7c8a" stroke-width=".5" transform="skewX(-38)"/>
|
||||
</g>
|
||||
<rect x="45" y="85" width="12" height="25" fill="#6b4a2e"/>
|
||||
<text x="50" y="145" font-size="10" fill="#1f4e5a" font-weight="700" text-anchor="middle">1 m² PV</text>
|
||||
</g>
|
||||
|
||||
<!-- Ergebnis -->
|
||||
<g transform="translate(160,40)">
|
||||
<rect x="0" y="30" width="160" height="80" rx="6" fill="#f4c94e"/>
|
||||
<text x="80" y="58" font-size="22" font-weight="900" fill="#1f4e5a" text-anchor="middle">≈ 170</text>
|
||||
<text x="80" y="78" font-size="12" font-weight="800" fill="#1f4e5a" text-anchor="middle">kWh pro Jahr</text>
|
||||
<text x="80" y="100" font-size="10" fill="#1f4e5a" text-anchor="middle">(Jahresertrag je m²)</text>
|
||||
</g>
|
||||
|
||||
<!-- Vergleich Waschmaschinen -->
|
||||
<g transform="translate(0,200)">
|
||||
<text x="160" y="0" font-size="11" font-weight="700" fill="#1f4e5a" text-anchor="middle">Das reicht für …</text>
|
||||
<g transform="translate(10,15)" font-size="11">
|
||||
<text y="18">🧺 170 × Waschmaschine</text>
|
||||
<text y="38">📺 1.200 Stunden Fernsehen</text>
|
||||
<text y="58">🚗 1.200 km im Elektroauto</text>
|
||||
<text y="78">💡 17.000 h mit einer 10-W-LED-Lampe</text>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<!-- Footer Quellen -->
|
||||
<g transform="translate(50,430)">
|
||||
<rect x="0" y="0" width="800" height="40" rx="4" fill="#fff" stroke="#dae8ec"/>
|
||||
<text x="12" y="16" font-size="10" font-weight="800" fill="#1f4e5a">AT 2024:</text>
|
||||
<text x="75" y="16" font-size="10" fill="#4a4a4a">ca. 6.400 MWp installiert — das entspricht rund 64 km² Modulfläche.</text>
|
||||
<text x="12" y="32" font-size="10" font-weight="800" fill="#1f4e5a">Quellen:</text>
|
||||
<text x="75" y="32" font-size="10" fill="#4a4a4a">Fraunhofer ISE, Photovoltaics Report 2024 · PV Austria, Marktbericht 2024</text>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 6.1 KiB |
@@ -0,0 +1,117 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1100 640" font-family="Inter, system-ui, sans-serif" width="1100" height="640">
|
||||
<defs>
|
||||
<!-- Feines Hintergrund-Raster für den 1000x1000-Block -->
|
||||
<pattern id="fineGrid" x="0" y="0" width="5" height="5" patternUnits="userSpaceOnUse">
|
||||
<path d="M 5 0 L 0 0 L 0 5" fill="none" stroke="#4a7c8a" stroke-width="0.05" opacity="0.35"/>
|
||||
</pattern>
|
||||
<pattern id="coarseGrid" x="0" y="0" width="50" height="50" patternUnits="userSpaceOnUse">
|
||||
<path d="M 50 0 L 0 0 L 0 50" fill="none" stroke="#4a7c8a" stroke-width="0.25" opacity="0.5"/>
|
||||
</pattern>
|
||||
<!-- Grobes Raster für den Zoom-Ausschnitt (10x10) -->
|
||||
<pattern id="zoomGrid" x="0" y="0" width="40" height="40" patternUnits="userSpaceOnUse">
|
||||
<path d="M 40 0 L 0 0 L 0 40" fill="none" stroke="#4a7c8a" stroke-width="1" opacity="0.35"/>
|
||||
</pattern>
|
||||
<!-- Pfeilspitze -->
|
||||
<marker id="arrow" viewBox="0 0 10 10" refX="8" refY="5" markerWidth="6" markerHeight="6" orient="auto">
|
||||
<path d="M 0 0 L 10 5 L 0 10 z" fill="#c85c4a"/>
|
||||
</marker>
|
||||
</defs>
|
||||
|
||||
<!-- ========== LINKE SEITE: 1.000.000 Teilchen ========== -->
|
||||
<g transform="translate(50, 70)">
|
||||
<!-- Titel -->
|
||||
<text x="250" y="-30" font-size="14" font-weight="800" fill="#1f4e5a" text-anchor="middle">
|
||||
1 Quadrat = 1.000.000 Luftteilchen
|
||||
</text>
|
||||
<text x="250" y="-12" font-size="11" fill="#8a8a8a" text-anchor="middle">
|
||||
1000 × 1000 Kästchen
|
||||
</text>
|
||||
|
||||
<!-- Hintergrundblock -->
|
||||
<rect x="0" y="0" width="500" height="500" fill="#eff5f6" stroke="#4a7c8a" stroke-width="2" rx="3"/>
|
||||
<!-- Feines Raster (alle 5 Units = alle 0,5% des Blocks) -->
|
||||
<rect x="0" y="0" width="500" height="500" fill="url(#fineGrid)"/>
|
||||
<!-- Grobes Raster (alle 50 Units = alle 5%) -->
|
||||
<rect x="0" y="0" width="500" height="500" fill="url(#coarseGrid)"/>
|
||||
|
||||
<!-- DAS EINE TEILCHEN — mathematisch korrekt 0,5 × 0,5 SVG-Units bei 500×500-Block = 1/1.000.000 -->
|
||||
<!-- Position (250, 250) — in der Mitte -->
|
||||
<rect x="249.75" y="249.75" width="0.5" height="0.5" fill="#c85c4a"/>
|
||||
|
||||
<!-- Pulsierender Glow-Kreis, damit man das Pixel überhaupt findet -->
|
||||
<circle cx="250" cy="250" r="0" fill="none" stroke="#c85c4a" stroke-width="1.5">
|
||||
<animate attributeName="r" values="4;45;4" dur="2.8s" repeatCount="indefinite"/>
|
||||
<animate attributeName="opacity" values="0.9;0;0.9" dur="2.8s" repeatCount="indefinite"/>
|
||||
<animate attributeName="stroke-width" values="2;0.3;2" dur="2.8s" repeatCount="indefinite"/>
|
||||
</circle>
|
||||
<!-- Zweiter Glow, versetzt für sanfteren Puls -->
|
||||
<circle cx="250" cy="250" r="0" fill="none" stroke="#c85c4a" stroke-width="1">
|
||||
<animate attributeName="r" values="0;30;0" dur="2.8s" begin="1.4s" repeatCount="indefinite"/>
|
||||
<animate attributeName="opacity" values="0.7;0;0.7" dur="2.8s" begin="1.4s" repeatCount="indefinite"/>
|
||||
</circle>
|
||||
|
||||
<!-- Lupen-Ausschnitt als gestricheltes Viereck (10×10 Einheiten) — zeigt was im Zoom rechts vergrössert wird -->
|
||||
<rect x="245" y="245" width="10" height="10" fill="none" stroke="#c85c4a" stroke-width="0.8" stroke-dasharray="2 1.5"/>
|
||||
|
||||
<!-- Pfeil zum Pixel -->
|
||||
<path d="M 400 150 Q 330 200 265 245" fill="none" stroke="#c85c4a" stroke-width="1.5" marker-end="url(#arrow)"/>
|
||||
<text x="405" y="138" font-size="13" font-weight="700" fill="#c85c4a">1 Teilchen</text>
|
||||
<text x="405" y="152" font-size="11" fill="#c85c4a">(1 ppm)</text>
|
||||
|
||||
<!-- Erklärung unter dem Block -->
|
||||
<text x="0" y="525" font-size="11" fill="#4a4a4a" font-weight="600">
|
||||
Jedes Mini-Kästchen = 1 Luftteilchen (N₂, O₂, Ar …)
|
||||
</text>
|
||||
<text x="0" y="543" font-size="10" fill="#8a8a8a">
|
||||
Das rote Kästchen ist so klein, dass du es kaum siehst — genau darum geht es.
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- Verbindungslinien vom Lupen-Ausschnitt zum Zoom-Block -->
|
||||
<g stroke="#c85c4a" stroke-width="0.8" stroke-dasharray="3 2" fill="none" opacity="0.6">
|
||||
<line x1="305" y1="315" x2="650" y2="120"/>
|
||||
<line x1="305" y1="325" x2="650" y2="520"/>
|
||||
</g>
|
||||
|
||||
<!-- ========== RECHTE SEITE: Zoom 100× (10×10 Ausschnitt) ========== -->
|
||||
<g transform="translate(650, 70)">
|
||||
<!-- Titel -->
|
||||
<text x="200" y="-30" font-size="14" font-weight="800" fill="#1f4e5a" text-anchor="middle">
|
||||
Zoom 100×: Ausschnitt 10 × 10
|
||||
</text>
|
||||
<text x="200" y="-12" font-size="11" fill="#8a8a8a" text-anchor="middle">
|
||||
Hier: 1 von 100 Teilchen sichtbar markiert
|
||||
</text>
|
||||
|
||||
<!-- Zoom-Block -->
|
||||
<rect x="0" y="0" width="400" height="400" fill="#eff5f6" stroke="#c85c4a" stroke-width="2" stroke-dasharray="4 3" rx="3"/>
|
||||
<!-- Grobes Raster (10×10) -->
|
||||
<rect x="0" y="0" width="400" height="400" fill="url(#zoomGrid)"/>
|
||||
|
||||
<!-- Das markierte Teilchen = 40×40 im Zoom (= 1/100 der Zoom-Fläche, entspricht 1/1.000.000 im Original) -->
|
||||
<rect x="180" y="180" width="40" height="40" fill="#c85c4a">
|
||||
<animate attributeName="opacity" values="1;0.6;1" dur="2.8s" repeatCount="indefinite"/>
|
||||
</rect>
|
||||
<!-- Weißes Fragezeichen / Hinweis im Pixel -->
|
||||
<text x="200" y="208" font-size="22" font-weight="900" fill="#fff" text-anchor="middle">CO₂</text>
|
||||
|
||||
<!-- Erklärung -->
|
||||
<text x="0" y="425" font-size="11" fill="#4a4a4a" font-weight="600">
|
||||
Das ist der kleine Lupen-Ausschnitt aus dem linken Block.
|
||||
</text>
|
||||
<text x="0" y="443" font-size="10" fill="#8a8a8a">
|
||||
In dieser Lupe hat sich das CO₂-Teilchen 100× vergrössert — nur so sieht man es.
|
||||
</text>
|
||||
</g>
|
||||
|
||||
<!-- ========== UNTEN: Didaktische Vergleiche ========== -->
|
||||
<g transform="translate(50, 590)">
|
||||
<rect x="0" y="0" width="1000" height="40" fill="#fff" stroke="#dae8ec" stroke-width="1" rx="6"/>
|
||||
<text x="20" y="18" font-size="11" fill="#1f4e5a" font-weight="700">
|
||||
Vergleiche für 1 ppm:
|
||||
</text>
|
||||
<text x="20" y="33" font-size="10.5" fill="#4a4a4a">
|
||||
1 Tropfen Tinte in 50 Litern Wasser · 1 Cent von 10.000 Euro · 1 Sekunde in 11,5 Tagen
|
||||
</text>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 5.9 KiB |
@@ -0,0 +1,139 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 900 500" font-family="Inter, system-ui, sans-serif" width="900" height="500">
|
||||
<defs>
|
||||
<marker id="th-arrow-in" viewBox="0 0 10 10" refX="8" refY="5" markerWidth="5" markerHeight="5" orient="auto">
|
||||
<path d="M 0 0 L 10 5 L 0 10 z" fill="#e8833a"/>
|
||||
</marker>
|
||||
<marker id="th-arrow-out" viewBox="0 0 10 10" refX="8" refY="5" markerWidth="5" markerHeight="5" orient="auto">
|
||||
<path d="M 0 0 L 10 5 L 0 10 z" fill="#c85c4a"/>
|
||||
</marker>
|
||||
<marker id="th-arrow-esc" viewBox="0 0 10 10" refX="8" refY="5" markerWidth="5" markerHeight="5" orient="auto">
|
||||
<path d="M 0 0 L 10 5 L 0 10 z" fill="#8a8a8a"/>
|
||||
</marker>
|
||||
<linearGradient id="th-space" x1="0" y1="0" x2="0" y2="1">
|
||||
<stop offset="0" stop-color="#0f2230"/>
|
||||
<stop offset="1" stop-color="#1f4e5a"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="th-atm" x1="0" y1="0" x2="0" y2="1">
|
||||
<stop offset="0" stop-color="#4a7c8a" stop-opacity=".18"/>
|
||||
<stop offset="1" stop-color="#4a7c8a" stop-opacity=".45"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="th-earth" x1="0" y1="0" x2="0" y2="1">
|
||||
<stop offset="0" stop-color="#5a8a5e"/>
|
||||
<stop offset="1" stop-color="#3a6b3e"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
|
||||
<!-- Titel -->
|
||||
<text x="450" y="30" font-size="16" font-weight="800" fill="#1f4e5a" text-anchor="middle">
|
||||
Treibhauseffekt — Wie die Erde warm bleibt
|
||||
</text>
|
||||
|
||||
<!-- Weltraum (schwarzer Hintergrund oben) -->
|
||||
<rect x="0" y="55" width="900" height="90" fill="url(#th-space)"/>
|
||||
<!-- Sterne -->
|
||||
<g fill="#fff" opacity=".7">
|
||||
<circle cx="80" cy="80" r="1"/><circle cx="220" cy="70" r=".8"/>
|
||||
<circle cx="420" cy="95" r="1.2"/><circle cx="640" cy="75" r="1"/>
|
||||
<circle cx="780" cy="90" r=".8"/><circle cx="160" cy="110" r=".7"/>
|
||||
<circle cx="540" cy="115" r="1"/><circle cx="720" cy="120" r=".9"/>
|
||||
</g>
|
||||
<text x="880" y="75" font-size="10" fill="#dae8ec" text-anchor="end" opacity=".8">Weltraum</text>
|
||||
|
||||
<!-- Sonne oben links -->
|
||||
<circle cx="110" cy="100" r="32" fill="#f4c94e"/>
|
||||
<circle cx="110" cy="100" r="38" fill="none" stroke="#f4c94e" stroke-width="1.5" opacity=".5"/>
|
||||
<circle cx="110" cy="100" r="46" fill="none" stroke="#f4c94e" stroke-width="1" opacity=".3"/>
|
||||
<text x="110" y="104" font-size="13" font-weight="800" fill="#1f4e5a" text-anchor="middle">☀</text>
|
||||
<text x="110" y="160" font-size="11" fill="#dae8ec" text-anchor="middle" font-weight="600">Sonne</text>
|
||||
|
||||
<!-- Atmosphäre -->
|
||||
<rect x="0" y="145" width="900" height="100" fill="url(#th-atm)"/>
|
||||
<line x1="0" y1="145" x2="900" y2="145" stroke="#4a7c8a" stroke-width="1" stroke-dasharray="4 3" opacity=".7"/>
|
||||
<line x1="0" y1="245" x2="900" y2="245" stroke="#4a7c8a" stroke-width="1" stroke-dasharray="4 3" opacity=".5"/>
|
||||
<text x="20" y="200" font-size="11" fill="#1f4e5a" font-weight="700">Atmosphäre</text>
|
||||
<text x="20" y="215" font-size="9" fill="#4a7c8a">CO₂ · CH₄ · H₂O · N₂O</text>
|
||||
|
||||
<!-- Treibhausgas-Moleküle in der Atmosphäre -->
|
||||
<g>
|
||||
<circle cx="280" cy="180" r="8" fill="#c85c4a" opacity=".75"/>
|
||||
<text x="280" y="184" font-size="8" font-weight="700" fill="#fff" text-anchor="middle">CO₂</text>
|
||||
<circle cx="380" cy="210" r="8" fill="#c85c4a" opacity=".75"/>
|
||||
<text x="380" y="214" font-size="8" font-weight="700" fill="#fff" text-anchor="middle">CO₂</text>
|
||||
<circle cx="500" cy="175" r="8" fill="#e8833a" opacity=".75"/>
|
||||
<text x="500" y="179" font-size="8" font-weight="700" fill="#fff" text-anchor="middle">CH₄</text>
|
||||
<circle cx="620" cy="205" r="8" fill="#c85c4a" opacity=".75"/>
|
||||
<text x="620" y="209" font-size="8" font-weight="700" fill="#fff" text-anchor="middle">CO₂</text>
|
||||
<circle cx="740" cy="180" r="8" fill="#4a7c8a" opacity=".65"/>
|
||||
<text x="740" y="184" font-size="7" font-weight="700" fill="#fff" text-anchor="middle">H₂O</text>
|
||||
</g>
|
||||
|
||||
<!-- Erde/Boden -->
|
||||
<rect x="0" y="385" width="900" height="115" fill="url(#th-earth)"/>
|
||||
<!-- Bäume & Häuser -->
|
||||
<g>
|
||||
<polygon points="140,385 150,360 160,385" fill="#3a6b3e"/>
|
||||
<rect x="148" y="385" width="4" height="10" fill="#6b4a2e"/>
|
||||
<polygon points="220,385 233,358 246,385" fill="#3a6b3e"/>
|
||||
<rect x="230" y="385" width="6" height="12" fill="#6b4a2e"/>
|
||||
<rect x="400" y="360" width="28" height="25" fill="#e8d5b5" stroke="#4a7c8a" stroke-width="1"/>
|
||||
<polygon points="398,361 414,348 430,361" fill="#c85c4a"/>
|
||||
<rect x="410" y="370" width="6" height="15" fill="#4a7c8a"/>
|
||||
<rect x="580" y="350" width="36" height="35" fill="#e8d5b5" stroke="#4a7c8a" stroke-width="1"/>
|
||||
<polygon points="578,351 598,334 618,351" fill="#c85c4a"/>
|
||||
<rect x="590" y="365" width="7" height="20" fill="#4a7c8a"/>
|
||||
<polygon points="720,385 735,356 750,385" fill="#3a6b3e"/>
|
||||
<rect x="731" y="385" width="6" height="10" fill="#6b4a2e"/>
|
||||
</g>
|
||||
<text x="20" y="425" font-size="11" fill="#fff" font-weight="700">Erdoberfläche</text>
|
||||
<text x="20" y="441" font-size="9" fill="#dceadd">absorbiert Licht · strahlt Wärme ab</text>
|
||||
|
||||
<!-- ========= STRAHLENGANG ========= -->
|
||||
<!-- Einkommende Sonnenstrahlung (gelb/orange) -->
|
||||
<g stroke="#e8833a" stroke-width="2" fill="none" marker-end="url(#th-arrow-in)" opacity=".9">
|
||||
<line x1="145" y1="125" x2="270" y2="370"/>
|
||||
<line x1="170" y1="130" x2="345" y2="370"/>
|
||||
<line x1="195" y1="135" x2="425" y2="370"/>
|
||||
</g>
|
||||
<text x="210" y="280" font-size="10" fill="#e8833a" font-weight="700" transform="rotate(58 210 280)">Sonnenlicht (kurzwellig)</text>
|
||||
|
||||
<!-- Abgestrahlte Wärme, die teilweise zurückgeworfen wird (rot) -->
|
||||
<g stroke="#c85c4a" stroke-width="2" fill="none" marker-end="url(#th-arrow-out)" opacity=".85">
|
||||
<!-- Nach oben vom Boden -->
|
||||
<line x1="470" y1="370" x2="500" y2="175"/>
|
||||
<line x1="610" y1="370" x2="620" y2="205"/>
|
||||
<line x1="350" y1="370" x2="380" y2="210"/>
|
||||
</g>
|
||||
|
||||
<!-- Rückreflexion von Treibhausgasen wieder zurück zur Erde -->
|
||||
<g stroke="#c85c4a" stroke-width="2" fill="none" marker-end="url(#th-arrow-out)" opacity=".8" stroke-dasharray="3 2">
|
||||
<path d="M 500 175 Q 540 270 550 370" />
|
||||
<path d="M 380 210 Q 360 290 410 370"/>
|
||||
<path d="M 620 205 Q 680 285 700 370"/>
|
||||
</g>
|
||||
<text x="550" y="330" font-size="10" fill="#c85c4a" font-weight="700">Wärmestrahlung zurück zur Erde</text>
|
||||
|
||||
<!-- Etwas Wärme entweicht ins All (grau) -->
|
||||
<g stroke="#8a8a8a" stroke-width="1.5" fill="none" marker-end="url(#th-arrow-esc)" opacity=".8" stroke-dasharray="2 2">
|
||||
<line x1="800" y1="370" x2="840" y2="80"/>
|
||||
</g>
|
||||
<text x="840" y="220" font-size="9" fill="#8a8a8a" text-anchor="end">Rest entweicht</text>
|
||||
|
||||
<!-- ========= VERGLEICHSBOX ========= -->
|
||||
<g transform="translate(0, 460)">
|
||||
<rect x="0" y="0" width="900" height="40" fill="#fff" stroke="#dae8ec" stroke-width="1"/>
|
||||
<text x="20" y="16" font-size="10" fill="#1f4e5a" font-weight="800">Ohne Atmosphäre:</text>
|
||||
<text x="165" y="16" font-size="10" fill="#c85c4a" font-weight="700">−18 °C</text>
|
||||
<text x="220" y="16" font-size="10" fill="#8a8a8a">(lebensfeindlich kalt)</text>
|
||||
|
||||
<text x="400" y="16" font-size="10" fill="#1f4e5a" font-weight="800">Mit natürlichem Treibhauseffekt:</text>
|
||||
<text x="615" y="16" font-size="10" fill="#5a8a5e" font-weight="700">+15 °C</text>
|
||||
<text x="660" y="16" font-size="10" fill="#8a8a8a">(Lebensraum Erde)</text>
|
||||
|
||||
<text x="20" y="32" font-size="10" fill="#1f4e5a" font-weight="800">Venus (extremer THE):</text>
|
||||
<text x="165" y="32" font-size="10" fill="#c85c4a" font-weight="700">+465 °C</text>
|
||||
|
||||
<text x="400" y="32" font-size="10" fill="#1f4e5a" font-weight="800">Erde seit 1850 (zusätzlich):</text>
|
||||
<text x="615" y="32" font-size="10" fill="#e8833a" font-weight="700">+1,2 °C</text>
|
||||
<text x="660" y="32" font-size="10" fill="#8a8a8a">(vom Menschen verursacht)</text>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 7.7 KiB |
@@ -0,0 +1,98 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 900 460" font-family="Inter, system-ui, sans-serif" width="900" height="460">
|
||||
<text x="450" y="30" font-size="16" font-weight="800" fill="#1f4e5a" text-anchor="middle">
|
||||
Die wichtigsten Treibhausgase — Wirkung und Anteil in Österreich
|
||||
</text>
|
||||
<text x="450" y="50" font-size="11" fill="#8a8a8a" text-anchor="middle">
|
||||
GWP-100 = Wirkung auf 100 Jahre, CO₂ als Referenz · Anteile AT 2023
|
||||
</text>
|
||||
|
||||
<!-- LINKS: log-Skala GWP-100 -->
|
||||
<g transform="translate(40,90)">
|
||||
<text x="250" y="0" font-size="13" font-weight="800" fill="#1f4e5a" text-anchor="middle">Wie stark wirkt 1 kg dieses Gases wie x kg CO₂?</text>
|
||||
<text x="250" y="15" font-size="10" fill="#8a8a8a" text-anchor="middle">(logarithmische Skala)</text>
|
||||
|
||||
<!-- Achse log: 1, 10, 100, 1000, 10000, 100000 -->
|
||||
<!-- x = 70 + log10(GWP) * 80 -->
|
||||
<line x1="70" y1="265" x2="540" y2="265" stroke="#1f4e5a" stroke-width="1.5"/>
|
||||
<g font-size="9" fill="#4a4a4a" text-anchor="middle">
|
||||
<line x1="70" y1="265" x2="70" y2="270" stroke="#1f4e5a"/><text x="70" y="283">1</text>
|
||||
<line x1="150" y1="265" x2="150" y2="270" stroke="#1f4e5a"/><text x="150" y="283">10</text>
|
||||
<line x1="230" y1="265" x2="230" y2="270" stroke="#1f4e5a"/><text x="230" y="283">100</text>
|
||||
<line x1="310" y1="265" x2="310" y2="270" stroke="#1f4e5a"/><text x="310" y="283">1.000</text>
|
||||
<line x1="390" y1="265" x2="390" y2="270" stroke="#1f4e5a"/><text x="390" y="283">10.000</text>
|
||||
<line x1="470" y1="265" x2="470" y2="270" stroke="#1f4e5a"/><text x="470" y="283">100.000</text>
|
||||
</g>
|
||||
|
||||
<!-- Balken (horizontal, log-skaliert) -->
|
||||
<!-- CO₂ GWP=1 → Balken bis 70 = 0 Länge. Minimalbreite 6 -->
|
||||
<g font-size="10">
|
||||
<!-- CO₂ -->
|
||||
<rect x="70" y="40" width="6" height="28" fill="#4a7c8a"/>
|
||||
<text x="66" y="57" fill="#1f4e5a" font-weight="800" text-anchor="end">CO₂</text>
|
||||
<text x="82" y="57" fill="#1f4e5a" font-weight="700">= 1 (Referenz)</text>
|
||||
|
||||
<!-- Methan GWP-100 = 28 → x = 70 + 1.447 * 80 = 185.8. Länge 115.8 -->
|
||||
<rect x="70" y="80" width="115.8" height="28" fill="#e8833a"/>
|
||||
<text x="66" y="97" fill="#1f4e5a" font-weight="800" text-anchor="end">Methan CH₄</text>
|
||||
<text x="192" y="97" fill="#1f4e5a" font-weight="700">= 28</text>
|
||||
|
||||
<!-- Lachgas N₂O = 273 → x = 70 + 2.436 * 80 = 264.9. Länge 194.9 -->
|
||||
<rect x="70" y="120" width="194.9" height="28" fill="#c85c4a"/>
|
||||
<text x="66" y="137" fill="#1f4e5a" font-weight="800" text-anchor="end">Lachgas N₂O</text>
|
||||
<text x="272" y="137" fill="#1f4e5a" font-weight="700">= 273</text>
|
||||
|
||||
<!-- HFC-134a = 1530 → log=3.185, x=70+3.185*80 = 324.8. Länge 254.8 -->
|
||||
<rect x="70" y="160" width="254.8" height="28" fill="#b07aa1"/>
|
||||
<text x="66" y="177" fill="#1f4e5a" font-weight="800" text-anchor="end">HFC-134a</text>
|
||||
<text x="332" y="177" fill="#1f4e5a" font-weight="700">= 1.530 (Kälte-/Klimagase)</text>
|
||||
|
||||
<!-- SF₆ = 23500 → log=4.371, x=70+4.371*80 = 419.7. Länge 349.7 -->
|
||||
<rect x="70" y="200" width="349.7" height="28" fill="#1a1a1a"/>
|
||||
<text x="66" y="217" fill="#1f4e5a" font-weight="800" text-anchor="end">SF₆</text>
|
||||
<text x="427" y="217" fill="#1f4e5a" font-weight="700">= 23.500 (Elektro-Schaltanlagen)</text>
|
||||
</g>
|
||||
<text x="250" y="308" font-size="10" fill="#8a8a8a" text-anchor="middle">Treibhauspotenzial (GWP-100 nach IPCC AR6)</text>
|
||||
</g>
|
||||
|
||||
<!-- RECHTS: Kuchen AT-Anteile 2023 -->
|
||||
<g transform="translate(720,220)">
|
||||
<text x="0" y="-135" font-size="13" font-weight="800" fill="#1f4e5a" text-anchor="middle">AT-Emissionen 2023</text>
|
||||
<text x="0" y="-120" font-size="10" fill="#8a8a8a" text-anchor="middle">68,7 Mt CO₂eq, aufgeteilt nach Gas</text>
|
||||
|
||||
<!-- Anteile: CO₂ 80%, CH₄ 11%, N₂O 6%, F-Gase 3% -->
|
||||
<!-- 80%: 0 → 288° -->
|
||||
<path d="M 0 0 L 0 -90 A 90 90 0 1 1 -85.59 27.81 Z" fill="#4a7c8a"/>
|
||||
<!-- CH₄ 11%: 288 → 327.6° -->
|
||||
<path d="M 0 0 L -85.59 27.81 A 90 90 0 0 1 -48.08 -75.94 Z" fill="#e8833a"/>
|
||||
<!-- N₂O 6%: 327.6 → 349.2° -->
|
||||
<path d="M 0 0 L -48.08 -75.94 A 90 90 0 0 1 -16.84 -88.41 Z" fill="#c85c4a"/>
|
||||
<!-- F-Gase 3%: 349.2 → 360° -->
|
||||
<path d="M 0 0 L -16.84 -88.41 A 90 90 0 0 1 0 -90 Z" fill="#b07aa1"/>
|
||||
|
||||
<!-- Zentrum -->
|
||||
<circle r="35" fill="#fff"/>
|
||||
<text y="-3" font-size="14" font-weight="900" fill="#1f4e5a" text-anchor="middle">68,7</text>
|
||||
<text y="12" font-size="9" font-weight="700" fill="#4a7c8a" text-anchor="middle">Mt CO₂eq</text>
|
||||
|
||||
<!-- Labels -->
|
||||
<text x="40" y="-30" font-size="11" font-weight="800" fill="#fff" text-anchor="middle">80 %</text>
|
||||
<text x="40" y="-15" font-size="9" fill="#fff" text-anchor="middle">CO₂</text>
|
||||
</g>
|
||||
|
||||
<!-- Legende rechts unterhalb -->
|
||||
<g transform="translate(640,335)" font-size="10">
|
||||
<g><rect width="12" height="12" fill="#4a7c8a"/><text x="18" y="10" fill="#1f4e5a" font-weight="700">CO₂ 80 %</text></g>
|
||||
<g transform="translate(90,0)"><rect width="12" height="12" fill="#e8833a"/><text x="18" y="10" fill="#1f4e5a" font-weight="700">CH₄ 11 %</text></g>
|
||||
<g transform="translate(0,18)"><rect width="12" height="12" fill="#c85c4a"/><text x="18" y="10" fill="#1f4e5a" font-weight="700">N₂O 6 %</text></g>
|
||||
<g transform="translate(90,18)"><rect width="12" height="12" fill="#b07aa1"/><text x="18" y="10" fill="#1f4e5a" font-weight="700">F-Gase 3 %</text></g>
|
||||
</g>
|
||||
|
||||
<!-- Footer -->
|
||||
<g transform="translate(50,410)">
|
||||
<rect x="0" y="0" width="800" height="40" rx="4" fill="#fff" stroke="#dae8ec"/>
|
||||
<text x="12" y="16" font-size="10" font-weight="800" fill="#1f4e5a">Wasserdampf:</text>
|
||||
<text x="100" y="16" font-size="10" fill="#4a4a4a">mengenmäßig stärkstes Treibhausgas, aber durch Temperatur gesteuert — nicht direkt vom Menschen reguliert.</text>
|
||||
<text x="12" y="32" font-size="10" font-weight="800" fill="#1f4e5a">Quellen:</text>
|
||||
<text x="70" y="32" font-size="10" fill="#4a4a4a">IPCC AR6 WG1 (2021), Tab. 7.15 (GWP-Werte) · Umweltbundesamt Österreich, Klimaschutzbericht 2024</text>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 6.0 KiB |
@@ -0,0 +1,123 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 900 460" font-family="Inter, system-ui, sans-serif" width="900" height="460">
|
||||
<defs>
|
||||
<linearGradient id="wk-water" x1="0" y1="0" x2="0" y2="1">
|
||||
<stop offset="0" stop-color="#4a7c8a"/>
|
||||
<stop offset="1" stop-color="#1f4e5a"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="wk-sky" x1="0" y1="0" x2="0" y2="1">
|
||||
<stop offset="0" stop-color="#eff5f6"/>
|
||||
<stop offset="1" stop-color="#dae8ec"/>
|
||||
</linearGradient>
|
||||
<marker id="wk-arr" viewBox="0 0 10 10" refX="8" refY="5" markerWidth="5" markerHeight="5" orient="auto">
|
||||
<path d="M 0 0 L 10 5 L 0 10 z" fill="#4a7c8a"/>
|
||||
</marker>
|
||||
</defs>
|
||||
|
||||
<text x="450" y="28" font-size="16" font-weight="800" fill="#1f4e5a" text-anchor="middle">
|
||||
Wasserkraft — die Topografie Österreichs als Stromspeicher
|
||||
</text>
|
||||
<text x="450" y="46" font-size="11" fill="#8a8a8a" text-anchor="middle">
|
||||
Zwei wichtige Bauformen im Querschnitt · Anteil am AT-Strom 2023: 58 %
|
||||
</text>
|
||||
|
||||
<!-- LINKS: Laufkraftwerk (Fluss-Stau) -->
|
||||
<g transform="translate(30,80)">
|
||||
<text x="200" y="0" font-size="13" font-weight="800" fill="#1f4e5a" text-anchor="middle">Laufkraftwerk (z. B. Donau)</text>
|
||||
|
||||
<!-- Himmel -->
|
||||
<rect x="0" y="15" width="400" height="110" fill="url(#wk-sky)"/>
|
||||
<!-- Bergflanke rechts -->
|
||||
<polygon points="0,125 400,125 400,260 0,260" fill="#c4a97a"/>
|
||||
<!-- Fluss oben -->
|
||||
<rect x="0" y="90" width="220" height="35" fill="url(#wk-water)"/>
|
||||
<!-- Wehr-Anlage -->
|
||||
<rect x="220" y="60" width="40" height="120" fill="#8a8a8a" stroke="#1f4e5a" stroke-width="1"/>
|
||||
<rect x="220" y="60" width="40" height="12" fill="#1f4e5a"/>
|
||||
<!-- Turbinenhaus -->
|
||||
<rect x="260" y="95" width="90" height="85" fill="#c85c4a" stroke="#1f4e5a" stroke-width="1"/>
|
||||
<rect x="260" y="95" width="90" height="10" fill="#a04030"/>
|
||||
<!-- Turbine (Kreis) -->
|
||||
<circle cx="305" cy="140" r="20" fill="#fff" stroke="#1f4e5a" stroke-width="1.5"/>
|
||||
<g transform="translate(305,140)" stroke="#4a7c8a" stroke-width="2" fill="none">
|
||||
<line x1="-14" y1="0" x2="14" y2="0"/>
|
||||
<line x1="0" y1="-14" x2="0" y2="14"/>
|
||||
<line x1="-10" y1="-10" x2="10" y2="10"/>
|
||||
<line x1="-10" y1="10" x2="10" y2="-10"/>
|
||||
</g>
|
||||
<text x="305" y="175" font-size="9" fill="#fff" font-weight="700" text-anchor="middle">Turbine</text>
|
||||
<!-- Fluss nach Kraftwerk, niedriger -->
|
||||
<rect x="350" y="115" width="50" height="25" fill="url(#wk-water)"/>
|
||||
|
||||
<!-- Wasser-Pfeil Stau→Turbine -->
|
||||
<path d="M 195 107 Q 240 135 290 140" stroke="#4a7c8a" stroke-width="2" fill="none" marker-end="url(#wk-arr)"/>
|
||||
|
||||
<!-- Höhen-Markierung -->
|
||||
<line x1="15" y1="90" x2="15" y2="140" stroke="#c85c4a" stroke-width="1" stroke-dasharray="3 2"/>
|
||||
<text x="18" y="118" font-size="9" fill="#c85c4a" font-weight="700">3–10 m</text>
|
||||
<text x="18" y="131" font-size="9" fill="#c85c4a">Fallhöhe</text>
|
||||
|
||||
<!-- Label -->
|
||||
<g transform="translate(10,205)">
|
||||
<rect x="0" y="0" width="380" height="48" rx="4" fill="#fff" stroke="#dae8ec"/>
|
||||
<text x="10" y="16" font-size="10" font-weight="800" fill="#1f4e5a">Laufend am Fluss — rund um die Uhr verfügbar.</text>
|
||||
<text x="10" y="32" font-size="10" fill="#4a4a4a">Beispiel AT: Kraftwerk Freudenau (Wien) · 172 MW · versorgt</text>
|
||||
<text x="10" y="44" font-size="10" fill="#4a4a4a">rechnerisch ca. 230.000 Haushalte.</text>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<!-- RECHTS: Speicherkraftwerk -->
|
||||
<g transform="translate(470,80)">
|
||||
<text x="200" y="0" font-size="13" font-weight="800" fill="#1f4e5a" text-anchor="middle">Speicherkraftwerk (z. B. Kaprun)</text>
|
||||
|
||||
<!-- Himmel -->
|
||||
<rect x="0" y="15" width="400" height="55" fill="url(#wk-sky)"/>
|
||||
<!-- Berge -->
|
||||
<polygon points="0,70 80,30 140,70" fill="#e8d5b5" stroke="#1f4e5a" stroke-width="1"/>
|
||||
<polygon points="100,70 170,25 240,70" fill="#c4a97a" stroke="#1f4e5a" stroke-width="1"/>
|
||||
<!-- Stauseefläche -->
|
||||
<rect x="45" y="70" width="180" height="40" fill="url(#wk-water)"/>
|
||||
<!-- Wehr links -->
|
||||
<rect x="225" y="70" width="15" height="60" fill="#8a8a8a" stroke="#1f4e5a"/>
|
||||
<!-- Berge auf Kraftwerks-Seite -->
|
||||
<polygon points="225,70 280,55 360,70" fill="#c4a97a" stroke="#1f4e5a" stroke-width="1"/>
|
||||
<polygon points="225,70 400,70 400,260 225,260" fill="#c4a97a"/>
|
||||
|
||||
<!-- Falllleitung (Druckrohr) durch den Berg -->
|
||||
<path d="M 235 130 Q 240 170 280 210" stroke="#4a7c8a" stroke-width="5" fill="none"/>
|
||||
<path d="M 235 130 Q 240 170 280 210" stroke="#fff" stroke-width="2" fill="none" stroke-dasharray="4 4"/>
|
||||
<text x="266" y="180" font-size="9" fill="#fff" font-weight="700" transform="rotate(65 266 180)">Druckrohr</text>
|
||||
|
||||
<!-- Turbinenhaus unten -->
|
||||
<rect x="270" y="210" width="90" height="50" fill="#c85c4a" stroke="#1f4e5a"/>
|
||||
<rect x="270" y="210" width="90" height="8" fill="#a04030"/>
|
||||
<circle cx="315" cy="235" r="14" fill="#fff" stroke="#1f4e5a" stroke-width="1.5"/>
|
||||
<g transform="translate(315,235)" stroke="#4a7c8a" stroke-width="1.5" fill="none">
|
||||
<line x1="-10" y1="0" x2="10" y2="0"/>
|
||||
<line x1="0" y1="-10" x2="0" y2="10"/>
|
||||
<line x1="-7" y1="-7" x2="7" y2="7"/>
|
||||
<line x1="-7" y1="7" x2="7" y2="-7"/>
|
||||
</g>
|
||||
<text x="315" y="255" font-size="9" fill="#fff" font-weight="700" text-anchor="middle">Turbine</text>
|
||||
|
||||
<!-- Höhen-Markierung -->
|
||||
<line x1="385" y1="80" x2="385" y2="230" stroke="#c85c4a" stroke-width="1" stroke-dasharray="3 2"/>
|
||||
<text x="378" y="150" font-size="9" fill="#c85c4a" font-weight="700" transform="rotate(-90 378 150)">bis 800 m Fallhöhe</text>
|
||||
|
||||
<!-- Label -->
|
||||
<g transform="translate(10,205)">
|
||||
<rect x="-7" y="68" width="380" height="48" rx="4" fill="#fff" stroke="#dae8ec"/>
|
||||
<text x="3" y="84" font-size="10" font-weight="800" fill="#1f4e5a">Wasser sammelt sich im Stausee — kann bei Bedarf abgelassen werden.</text>
|
||||
<text x="3" y="100" font-size="10" fill="#4a4a4a">Beispiel AT: Pumpspeicher Kops II (Vorarlberg) · 525 MW.</text>
|
||||
<text x="3" y="112" font-size="10" fill="#4a4a4a">Wirkt wie eine gigantische Batterie für Wind- und Solarstrom.</text>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<!-- Footer -->
|
||||
<g transform="translate(50,415)">
|
||||
<rect x="0" y="0" width="800" height="35" rx="4" fill="#fff" stroke="#dae8ec"/>
|
||||
<text x="12" y="15" font-size="10" font-weight="800" fill="#1f4e5a">AT 2023:</text>
|
||||
<text x="72" y="15" font-size="10" fill="#4a4a4a">58 % der Stromerzeugung aus Wasserkraft · ca. 15.000 MW installierte Leistung · mehr als 2.700 Anlagen.</text>
|
||||
<text x="12" y="30" font-size="10" font-weight="800" fill="#1f4e5a">Quellen:</text>
|
||||
<text x="70" y="30" font-size="10" fill="#4a4a4a">E-Control, Betriebsstatistik Strom 2023 · VERBUND · WWF Österreich (ökologische Bewertung)</text>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 6.7 KiB |
@@ -0,0 +1,149 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 900 520" font-family="Inter, system-ui, sans-serif" width="900" height="520">
|
||||
<defs>
|
||||
<linearGradient id="wr-sky" x1="0" y1="0" x2="0" y2="1">
|
||||
<stop offset="0" stop-color="#eff5f6"/>
|
||||
<stop offset="1" stop-color="#dae8ec"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
|
||||
<!-- Hintergrund -->
|
||||
<rect x="0" y="40" width="900" height="420" fill="url(#wr-sky)"/>
|
||||
<!-- Boden -->
|
||||
<rect x="0" y="440" width="900" height="20" fill="#5a8a5e"/>
|
||||
<rect x="0" y="460" width="900" height="60" fill="#3a6b3e"/>
|
||||
|
||||
<text x="450" y="26" font-size="16" font-weight="800" fill="#1f4e5a" text-anchor="middle">
|
||||
Wie groß ist ein modernes Windrad wirklich?
|
||||
</text>
|
||||
|
||||
<!-- Vergleichsfiguren. Höhe aus Boden y=440 nach oben berechnet -->
|
||||
<!-- SKALA: 1 m = ca. 1.4 px → Gesamthöhe sichtbar ~280 m -->
|
||||
<!-- Boden = y=440, 1 m = 1.4 px → y = 440 - höhe*1.4 -->
|
||||
|
||||
<!-- 1) Mensch (1,8 m) -->
|
||||
<g transform="translate(80, 437.5)">
|
||||
<!-- Kopf+Körper Kompakt bei dieser Skala -->
|
||||
<circle cx="0" cy="-2" r=".8" fill="#1f4e5a"/>
|
||||
<rect x="-.6" y="-1.5" width="1.2" height="3" fill="#1f4e5a"/>
|
||||
<text x="20" y="0" font-size="10" font-weight="700" fill="#1f4e5a">Mensch</text>
|
||||
<text x="20" y="11" font-size="9" fill="#8a8a8a">1,8 m</text>
|
||||
</g>
|
||||
|
||||
<!-- 2) Einfamilienhaus (8 m = 11px) -->
|
||||
<g transform="translate(150, 440)">
|
||||
<rect x="-12" y="-11" width="24" height="11" fill="#e8d5b5" stroke="#1f4e5a" stroke-width=".6"/>
|
||||
<polygon points="-14,-11 0,-18 14,-11" fill="#c85c4a"/>
|
||||
<rect x="-2" y="-6" width="4" height="6" fill="#4a7c8a"/>
|
||||
<text x="30" y="-8" font-size="10" font-weight="700" fill="#1f4e5a">Einfamilienhaus</text>
|
||||
<text x="30" y="3" font-size="9" fill="#8a8a8a">≈ 8 m</text>
|
||||
</g>
|
||||
|
||||
<!-- 3) Baum (25 m = 35px) -->
|
||||
<g transform="translate(250, 440)">
|
||||
<rect x="-1.5" y="-10" width="3" height="10" fill="#6b4a2e"/>
|
||||
<ellipse cx="0" cy="-22" rx="14" ry="22" fill="#3a6b3e"/>
|
||||
<text x="25" y="-42" font-size="10" font-weight="700" fill="#1f4e5a">Alter Baum</text>
|
||||
<text x="25" y="-31" font-size="9" fill="#8a8a8a">25 m</text>
|
||||
</g>
|
||||
|
||||
<!-- 4) Kirchturm (60 m = 84px) -->
|
||||
<g transform="translate(345, 440)">
|
||||
<rect x="-8" y="-60" width="16" height="60" fill="#c4a97a" stroke="#1f4e5a" stroke-width=".6"/>
|
||||
<rect x="-10" y="-60" width="20" height="4" fill="#c85c4a"/>
|
||||
<polygon points="-10,-60 0,-84 10,-60" fill="#c85c4a"/>
|
||||
<rect x="-2" y="-48" width="4" height="8" fill="#1a1a1a"/>
|
||||
<circle cx="0" cy="-68" r="3" fill="#e8d5b5"/>
|
||||
<text x="20" y="-80" font-size="10" font-weight="700" fill="#1f4e5a">Kirchturm</text>
|
||||
<text x="20" y="-69" font-size="9" fill="#8a8a8a">≈ 60 m</text>
|
||||
</g>
|
||||
|
||||
<!-- 5) Altes Windrad (60 m) -->
|
||||
<g transform="translate(440, 440)">
|
||||
<rect x="-2" y="-84" width="4" height="84" fill="#8a8a8a"/>
|
||||
<circle cx="0" cy="-84" r="2.5" fill="#1f4e5a"/>
|
||||
<!-- 3 Rotorblätter, L ≈ 22m -->
|
||||
<g stroke="#1f4e5a" stroke-width="2" stroke-linecap="round">
|
||||
<line x1="0" y1="-84" x2="0" y2="-115"/>
|
||||
<line x1="0" y1="-84" x2="27" y2="-69"/>
|
||||
<line x1="0" y1="-84" x2="-27" y2="-69"/>
|
||||
</g>
|
||||
<text x="32" y="-112" font-size="10" font-weight="700" fill="#1f4e5a">Windrad 2000</text>
|
||||
<text x="32" y="-100" font-size="9" fill="#8a8a8a">Nabe 60 m · 1 MW</text>
|
||||
</g>
|
||||
|
||||
<!-- 6) DC Tower Wien (220 m = 308 px) -->
|
||||
<g transform="translate(580, 440)">
|
||||
<rect x="-12" y="-308" width="24" height="308" fill="#4a7c8a" stroke="#1f4e5a" stroke-width=".6"/>
|
||||
<g fill="#e8d5b5" opacity=".75">
|
||||
<rect x="-10" y="-300" width="20" height="3"/>
|
||||
<rect x="-10" y="-280" width="20" height="3"/>
|
||||
<rect x="-10" y="-260" width="20" height="3"/>
|
||||
<rect x="-10" y="-240" width="20" height="3"/>
|
||||
<rect x="-10" y="-220" width="20" height="3"/>
|
||||
<rect x="-10" y="-200" width="20" height="3"/>
|
||||
<rect x="-10" y="-180" width="20" height="3"/>
|
||||
<rect x="-10" y="-160" width="20" height="3"/>
|
||||
<rect x="-10" y="-140" width="20" height="3"/>
|
||||
<rect x="-10" y="-120" width="20" height="3"/>
|
||||
<rect x="-10" y="-100" width="20" height="3"/>
|
||||
<rect x="-10" y="-80" width="20" height="3"/>
|
||||
<rect x="-10" y="-60" width="20" height="3"/>
|
||||
<rect x="-10" y="-40" width="20" height="3"/>
|
||||
</g>
|
||||
<text x="18" y="-304" font-size="10" font-weight="700" fill="#1f4e5a">DC Tower Wien</text>
|
||||
<text x="18" y="-293" font-size="9" fill="#8a8a8a">220 m (höchstes AT)</text>
|
||||
<line x1="-14" y1="-308" x2="20" y2="-308" stroke="#4a7c8a" stroke-width="1" stroke-dasharray="2 2"/>
|
||||
</g>
|
||||
|
||||
<!-- 7) Modernes Windrad (240 m Gesamthöhe: Nabe 160m + Rotor 80m) -->
|
||||
<g transform="translate(770, 440)">
|
||||
<!-- Turm -->
|
||||
<polygon points="-4,0 4,0 2.5,-224 -2.5,-224" fill="#fff" stroke="#1f4e5a" stroke-width="1"/>
|
||||
<!-- Gondel (Maschinenhaus) -->
|
||||
<rect x="-6" y="-228" width="12" height="8" fill="#1f4e5a" rx="1"/>
|
||||
<!-- Nabe -->
|
||||
<circle cx="0" cy="-224" r="3.5" fill="#c85c4a"/>
|
||||
<!-- 3 Rotorblätter, L = 85 m = 119 px -->
|
||||
<g stroke="#1f4e5a" stroke-width="2.6" stroke-linecap="round" fill="none">
|
||||
<line x1="0" y1="-224" x2="0" y2="-343"/>
|
||||
<line x1="0" y1="-224" x2="103" y2="-164"/>
|
||||
<line x1="0" y1="-224" x2="-103" y2="-164"/>
|
||||
</g>
|
||||
|
||||
<!-- Maß-Pfeil Gesamthöhe -->
|
||||
<line x1="80" y1="-343" x2="80" y2="0" stroke="#c85c4a" stroke-width="1" stroke-dasharray="3 2"/>
|
||||
<polygon points="78,-340 82,-340 80,-348" fill="#c85c4a"/>
|
||||
<polygon points="78,-3 82,-3 80,5" fill="#c85c4a"/>
|
||||
<text x="87" y="-170" font-size="11" fill="#c85c4a" font-weight="800">240 m</text>
|
||||
<text x="87" y="-156" font-size="9" fill="#c85c4a">Gesamthöhe</text>
|
||||
|
||||
<text x="-125" y="-338" font-size="10" font-weight="700" fill="#1f4e5a">Modernes Windrad</text>
|
||||
<text x="-125" y="-326" font-size="9" fill="#8a8a8a">Nabe 160 m · 7 MW</text>
|
||||
<text x="-125" y="-313" font-size="9" fill="#5a8a5e" font-weight="700">5.000 Haushalte</text>
|
||||
</g>
|
||||
|
||||
<!-- Höhenlinien im Hintergrund -->
|
||||
<g stroke="#4a7c8a" stroke-width=".5" opacity=".25" stroke-dasharray="2 3">
|
||||
<line x1="30" y1="440" x2="870" y2="440"/>
|
||||
<line x1="30" y1="356" x2="870" y2="356"/> <!-- 60 m -->
|
||||
<line x1="30" y1="272" x2="870" y2="272"/> <!-- 120 m -->
|
||||
<line x1="30" y1="216" x2="870" y2="216"/> <!-- 160 m -->
|
||||
<line x1="30" y1="132" x2="870" y2="132"/> <!-- 220 m -->
|
||||
<line x1="30" y1="97" x2="870" y2="97"/> <!-- 245 m -->
|
||||
</g>
|
||||
<g font-size="8" fill="#4a7c8a" opacity=".7">
|
||||
<text x="35" y="358">60 m</text>
|
||||
<text x="35" y="274">120 m</text>
|
||||
<text x="35" y="218">160 m (Nabe)</text>
|
||||
<text x="35" y="134">220 m</text>
|
||||
</g>
|
||||
|
||||
<!-- Footer Fakten -->
|
||||
<g transform="translate(0, 465)">
|
||||
<rect x="50" y="0" width="800" height="50" rx="6" fill="#fff" stroke="#dae8ec" stroke-width="1"/>
|
||||
<text x="70" y="18" font-size="10" fill="#1f4e5a" font-weight="800">Ein Windrad liefert:</text>
|
||||
<text x="185" y="18" font-size="10" fill="#4a4a4a">8–20 Millionen kWh pro Jahr — Strom für 2.500 bis 6.000 Haushalte.</text>
|
||||
<text x="70" y="36" font-size="10" fill="#1f4e5a" font-weight="800">Österreich 2024:</text>
|
||||
<text x="185" y="36" font-size="10" fill="#4a4a4a">ca. 1.400 Windräder · zusammen rund 3.900 MW · decken ~12 % des Strombedarfs.</text>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 7.2 KiB |
@@ -0,0 +1,357 @@
|
||||
/**
|
||||
* Glossar-Experimente — kleine interaktive Widgets im Detail-Modal.
|
||||
*
|
||||
* Registrierung: window.GlossarExperiments[key_slug] = function (root) { … }
|
||||
* Der Renderer (glossar.php) hängt einen leeren Container ein und ruft die
|
||||
* Funktion mit diesem Container als einzigem Argument auf. Das Widget baut
|
||||
* selbst seinen DOM und bindet seine Events.
|
||||
*
|
||||
* Richtlinien:
|
||||
* - Keine externen Libraries.
|
||||
* - Mobile-/Tap-freundlich: grosse Buttons, keine Hover-Abhängigkeit.
|
||||
* - Zahlen quellenbar, kurze Begründung in der UI sichtbar.
|
||||
*/
|
||||
|
||||
(function () {
|
||||
'use strict';
|
||||
|
||||
const NS = 'http://www.w3.org/2000/svg';
|
||||
const svgEl = (tag, attrs, parent) => {
|
||||
const el = document.createElementNS(NS, tag);
|
||||
if (attrs) for (const k in attrs) el.setAttribute(k, attrs[k]);
|
||||
if (parent) parent.appendChild(el);
|
||||
return el;
|
||||
};
|
||||
|
||||
// =====================================================================
|
||||
// Experiment: kWh-Rennen — wie weit kommt man mit 1 Kilowattstunde?
|
||||
// =====================================================================
|
||||
function kwhRace(root) {
|
||||
root.innerHTML = `
|
||||
<div class="ge-wrap">
|
||||
<div class="ge-head">
|
||||
<h3>🏁 Das kWh-Rennen</h3>
|
||||
<p>Drei Fahrzeuge starten rechts mit <strong>derselben Energie</strong>: 1 Kilowattstunde. Wie weit kommen sie nach links?</p>
|
||||
</div>
|
||||
<svg class="ge-track" viewBox="0 0 600 320" preserveAspectRatio="xMidYMid meet" aria-hidden="true"></svg>
|
||||
<div class="ge-controls">
|
||||
<button class="ge-btn ge-btn-primary" data-act="start">▶ Start</button>
|
||||
<button class="ge-btn" data-act="reset">↺ Zurück</button>
|
||||
</div>
|
||||
<ul class="ge-legend">
|
||||
<li><span class="ge-dot" style="background:#5a8a5e"></span>E-Fahrrad · <strong>10 Wh/km</strong> → ca. 100 km</li>
|
||||
<li><span class="ge-dot" style="background:#4a7c8a"></span>E-Auto · <strong>150 Wh/km</strong> → ca. 6,5 km</li>
|
||||
<li><span class="ge-dot" style="background:#c85c4a"></span>Benzin-Auto · <strong>530 Wh/km</strong> aus Kraftstoffenergie → ca. 1,9 km</li>
|
||||
</ul>
|
||||
<p class="ge-note">Quellen: ADAC Stromverbrauchstests E-Auto · Hersteller-Angaben E-Bike Bosch Performance · WLTP Benziner 6 L/100 km × 8,8 kWh/L. Der Benziner verliert rund 70 % der Kraftstoffenergie als Motor-Wärme — deshalb kommt er weniger weit.</p>
|
||||
</div>
|
||||
`;
|
||||
const svg = root.querySelector('.ge-track');
|
||||
|
||||
// Emoji-Fahrzeuge: auf Windows/Chrome schauen 🚴 🚗 🚙 nach links → sie fahren
|
||||
// von rechts nach links, Emojis passen zur Fahrtrichtung ohne Plattform-Trick.
|
||||
const vehicles = [
|
||||
{ label: 'E-Fahrrad', emoji: '🚴', km: 100, color: '#5a8a5e', y: 100 },
|
||||
{ label: 'E-Auto', emoji: '🚗', km: 6.5, color: '#4a7c8a', y: 190 },
|
||||
{ label: 'Benzin-Auto', emoji: '🚙', km: 1.9, color: '#c85c4a', y: 280 }
|
||||
];
|
||||
const MAX_KM = 100;
|
||||
const TRACK_L = 50, TRACK_R = 560;
|
||||
const trackLen = TRACK_R - TRACK_L;
|
||||
|
||||
// Skala oben — Start rechts (0 km), Ziel links (100 km)
|
||||
const axis = svgEl('g', { class: 'ge-axis' }, svg);
|
||||
svgEl('line', { x1: TRACK_L, y1: 52, x2: TRACK_R, y2: 52, stroke: '#1f4e5a', 'stroke-width': '1.2' }, axis);
|
||||
[0, 25, 50, 75, 100].forEach(km => {
|
||||
const x = TRACK_R - (km / MAX_KM) * trackLen;
|
||||
svgEl('line', { x1: x, y1: 48, x2: x, y2: 56, stroke: '#1f4e5a', 'stroke-width': '1' }, axis);
|
||||
const t = svgEl('text', { x, y: 40, 'text-anchor': 'middle', 'font-size': '11', fill: '#4a4a4a', 'font-weight': '600' }, axis);
|
||||
t.textContent = km + ' km';
|
||||
});
|
||||
// „Start" Marker ganz rechts
|
||||
const startTxt = svgEl('text', { x: TRACK_R, y: 20, 'text-anchor': 'end', 'font-size': '11', fill: '#1f4e5a', 'font-weight': '700' }, svg);
|
||||
startTxt.textContent = '← Start mit 1 kWh';
|
||||
|
||||
// Spuren + Fahrzeuge
|
||||
const nodes = vehicles.map(v => {
|
||||
const g = svgEl('g', { class: 'ge-lane' }, svg);
|
||||
// Label ÜBER der Spur, rechts beim Start
|
||||
const label = svgEl('text', { x: TRACK_R, y: v.y - 22, 'text-anchor': 'end', 'font-size': '12', 'font-weight': '800', fill: v.color }, g);
|
||||
label.textContent = v.label;
|
||||
// Straßenlinie
|
||||
svgEl('line', { x1: TRACK_L, y1: v.y, x2: TRACK_R, y2: v.y, stroke: '#dae8ec', 'stroke-width': '5', 'stroke-linecap': 'round' }, g);
|
||||
// Ziel-Markierung (links vom Start)
|
||||
const xEnd = TRACK_R - (v.km / MAX_KM) * trackLen;
|
||||
svgEl('line', { x1: xEnd, y1: v.y - 16, x2: xEnd, y2: v.y + 16, stroke: v.color, 'stroke-width': '2', 'stroke-dasharray': '3 2', opacity: '.55' }, g);
|
||||
// Emoji-Fahrzeug
|
||||
const icon = svgEl('text', { x: TRACK_R, y: v.y + 8, 'text-anchor': 'middle', 'font-size': '30' }, g);
|
||||
icon.textContent = v.emoji;
|
||||
// Ergebnis-Label LINKS vom Ziel (in Fahrtrichtung weiter)
|
||||
const result = svgEl('text', { x: xEnd - 10, y: v.y + 4, 'text-anchor': 'end', 'font-size': '12', 'font-weight': '800', fill: v.color, opacity: '0' }, g);
|
||||
result.textContent = v.km.toFixed(1).replace('.', ',') + ' km';
|
||||
return { v, icon, result, xStart: TRACK_R, xEnd };
|
||||
});
|
||||
|
||||
// Animation
|
||||
let animId = null;
|
||||
function setX(n, x) { n.icon.setAttribute('x', x); }
|
||||
function animate() {
|
||||
cancelAnimationFrame(animId);
|
||||
const dur = 6500; // ms — bewusst langsam
|
||||
const start = performance.now();
|
||||
nodes.forEach(n => { setX(n, n.xStart); n.result.setAttribute('opacity', '0'); });
|
||||
function tick(now) {
|
||||
const t = Math.min(1, (now - start) / dur);
|
||||
const e = 1 - Math.pow(1 - t, 3);
|
||||
nodes.forEach(n => {
|
||||
const x = n.xStart + (n.xEnd - n.xStart) * e;
|
||||
setX(n, x);
|
||||
if (t > 0.96) n.result.setAttribute('opacity', '1');
|
||||
});
|
||||
if (t < 1) animId = requestAnimationFrame(tick);
|
||||
}
|
||||
animId = requestAnimationFrame(tick);
|
||||
}
|
||||
function reset() {
|
||||
cancelAnimationFrame(animId);
|
||||
nodes.forEach(n => { setX(n, n.xStart); n.result.setAttribute('opacity', '0'); });
|
||||
}
|
||||
|
||||
root.querySelector('[data-act="start"]').addEventListener('click', animate);
|
||||
root.querySelector('[data-act="reset"]').addEventListener('click', reset);
|
||||
}
|
||||
|
||||
// =====================================================================
|
||||
// Experiment: ppm-Raster — 1 Teilchen von 1.000.000 findet man kaum
|
||||
// =====================================================================
|
||||
function ppmGrid(root) {
|
||||
root.innerHTML = `
|
||||
<div class="ge-wrap">
|
||||
<div class="ge-head">
|
||||
<h3>🔍 Finde das eine Teilchen</h3>
|
||||
<p>Unten siehst du ein Gitter mit <strong>10.000 Punkten</strong>. Ein einziger Punkt ist rot — das entspräche 100 ppm (echte 1 ppm wäre nochmal 100× feiner). Versuche, ihn zu finden und zu tippen!</p>
|
||||
</div>
|
||||
<div class="ge-ppm-grid" id="ge-ppm"></div>
|
||||
<div class="ge-ppm-msg" aria-live="polite"></div>
|
||||
<div class="ge-controls">
|
||||
<button class="ge-btn ge-btn-primary" data-act="highlight">💡 Tipp zeigen</button>
|
||||
<button class="ge-btn" data-act="new">🎲 Neues Teilchen</button>
|
||||
</div>
|
||||
<p class="ge-note">Bei der aktuellen CO₂-Konzentration von 422 ppm sind 422 von 1.000.000 Luftteilchen CO₂. Das klingt winzig — reicht aber, um die Erde messbar zu erwärmen. Quelle: NOAA Mauna Loa (2024).</p>
|
||||
</div>
|
||||
`;
|
||||
const grid = root.querySelector('#ge-ppm');
|
||||
const msg = root.querySelector('.ge-ppm-msg');
|
||||
const COLS = 100, ROWS = 100;
|
||||
let special = Math.floor(Math.random() * COLS * ROWS);
|
||||
let found = false;
|
||||
|
||||
function render() {
|
||||
grid.innerHTML = '';
|
||||
grid.style.gridTemplateColumns = `repeat(${COLS}, 1fr)`;
|
||||
for (let i = 0; i < COLS * ROWS; i++) {
|
||||
const cell = document.createElement('span');
|
||||
if (i === special) cell.className = 'ge-ppm-special';
|
||||
grid.appendChild(cell);
|
||||
}
|
||||
msg.textContent = '';
|
||||
msg.classList.remove('show', 'miss');
|
||||
found = false;
|
||||
}
|
||||
function highlight() {
|
||||
const el = grid.children[special];
|
||||
if (!el) return;
|
||||
el.classList.add('ge-ppm-flash');
|
||||
setTimeout(() => el.classList.remove('ge-ppm-flash'), 1800);
|
||||
}
|
||||
function newOne() {
|
||||
special = Math.floor(Math.random() * COLS * ROWS);
|
||||
render();
|
||||
}
|
||||
function onHit(cell) {
|
||||
if (found) return;
|
||||
found = true;
|
||||
cell.classList.add('ge-ppm-hit');
|
||||
msg.textContent = '🎉 Getroffen! Das war 1 von 10.000 Punkten.';
|
||||
msg.classList.remove('miss');
|
||||
msg.classList.add('show');
|
||||
}
|
||||
function onMiss() {
|
||||
if (found) return;
|
||||
msg.textContent = 'Daneben — probier "Tipp zeigen" für eine kurze Hilfe.';
|
||||
msg.classList.remove('show');
|
||||
msg.classList.add('show', 'miss');
|
||||
}
|
||||
// Click-Handler delegiert auf das Grid (funktioniert auch bei 4-px-Zellen)
|
||||
grid.addEventListener('click', ev => {
|
||||
const target = ev.target;
|
||||
if (target === grid) return;
|
||||
if (target.classList && target.classList.contains('ge-ppm-special')) onHit(target);
|
||||
else onMiss();
|
||||
});
|
||||
render();
|
||||
root.querySelector('[data-act="highlight"]').addEventListener('click', highlight);
|
||||
root.querySelector('[data-act="new"]').addEventListener('click', newOne);
|
||||
}
|
||||
|
||||
// =====================================================================
|
||||
// Experiment: Albedo-Slider — Oberfläche wechseln, Reflexion beobachten
|
||||
// =====================================================================
|
||||
function albedoSlider(root) {
|
||||
const surfaces = [
|
||||
{ key: 'snow', label: 'Frischer Schnee', albedo: 0.85, color: '#ffffff', border: '#b5c9cf' },
|
||||
{ key: 'desert', label: 'Sand-Wüste', albedo: 0.35, color: '#e8d5b5', border: '#c4a97a' },
|
||||
{ key: 'forest', label: 'Wald', albedo: 0.12, color: '#3a6b3e', border: '#2a5030' },
|
||||
{ key: 'ocean', label: 'Ozean', albedo: 0.06, color: '#1f4e5a', border: '#0f2f3a' },
|
||||
{ key: 'asphalt', label: 'Asphalt', albedo: 0.05, color: '#2a2a2a', border: '#1a1a1a' }
|
||||
];
|
||||
root.innerHTML = `
|
||||
<div class="ge-wrap">
|
||||
<div class="ge-head">
|
||||
<h3>☀ Welche Oberfläche reflektiert wie viel?</h3>
|
||||
<p>Wähle eine Oberfläche. Die Pfeile zeigen, wie viel Sonnenlicht zurückgeworfen wird.</p>
|
||||
</div>
|
||||
<div class="ge-albedo-choice" role="tablist">
|
||||
${surfaces.map((s, i) => `
|
||||
<button class="ge-btn ${i===0?'ge-btn-primary':''}" data-key="${s.key}">${s.label}</button>
|
||||
`).join('')}
|
||||
</div>
|
||||
<svg class="ge-albedo-svg" viewBox="0 0 600 320" preserveAspectRatio="xMidYMid meet"></svg>
|
||||
<div class="ge-albedo-stats">
|
||||
<div>Albedo: <strong id="ge-alb-val">0,85</strong></div>
|
||||
<div>Reflektiert: <strong id="ge-alb-refl">85 %</strong></div>
|
||||
<div>Absorbiert: <strong id="ge-alb-abs">15 %</strong></div>
|
||||
</div>
|
||||
<p class="ge-note">Darum erwärmt sich die Arktis 4-mal schneller als die Erde insgesamt: Schmilzt Eis, kommt darunter dunkler Ozean zum Vorschein, der viel mehr Sonnenenergie aufnimmt. Quelle: Rantanen et al. 2022.</p>
|
||||
</div>
|
||||
`;
|
||||
const svg = root.querySelector('.ge-albedo-svg');
|
||||
const valEl = root.querySelector('#ge-alb-val');
|
||||
const reflEl = root.querySelector('#ge-alb-refl');
|
||||
const absEl = root.querySelector('#ge-alb-abs');
|
||||
|
||||
// Statischer Aufbau: Himmel + Sonne + Bodenrechteck
|
||||
svgEl('rect', { x: 0, y: 0, width: 600, height: 210, fill: '#eff5f6' }, svg);
|
||||
svgEl('circle', { cx: 90, cy: 70, r: 30, fill: '#f4c94e' }, svg);
|
||||
const surfaceRect = svgEl('rect', { x: 0, y: 210, width: 600, height: 110, fill: '#ffffff', stroke: '#b5c9cf', 'stroke-width': '1.5' }, svg);
|
||||
// Einfallender Lichtstrahl (Sonne → Boden)
|
||||
svgEl('line', { x1: 110, y1: 100, x2: 300, y2: 210, stroke: '#e8833a', 'stroke-width': '3', 'stroke-linecap': 'round' }, svg);
|
||||
svgEl('polygon', { points: '295,205 306,208 300,215', fill: '#e8833a' }, svg);
|
||||
// Reflexions-Pfeile (dynamisch nach Albedo)
|
||||
const reflG = svgEl('g', { class: 'ge-albedo-refl' }, svg);
|
||||
|
||||
function setSurface(key) {
|
||||
const s = surfaces.find(x => x.key === key) || surfaces[0];
|
||||
surfaceRect.setAttribute('fill', s.color);
|
||||
surfaceRect.setAttribute('stroke', s.border);
|
||||
// Anzahl reflektierter Pfeile proportional zur Albedo (1 bis 9 Pfeile)
|
||||
reflG.innerHTML = '';
|
||||
const nArrows = Math.max(1, Math.round(s.albedo * 10));
|
||||
for (let i = 0; i < nArrows; i++) {
|
||||
const angle = -60 + i * (120 / Math.max(1, nArrows - 1));
|
||||
const rad = angle * Math.PI / 180;
|
||||
const startX = 300, startY = 210;
|
||||
const len = 120;
|
||||
const endX = startX + Math.cos(rad) * len;
|
||||
const endY = startY - Math.sin(Math.abs(rad) * Math.PI / 180 + 0.3) * Math.abs(len * Math.cos(rad) / 90) - 60;
|
||||
// Simpler: Linien gleichmäßig nach oben gefächert
|
||||
const e2x = 300 + Math.sin(rad) * len;
|
||||
const e2y = 210 - Math.cos(rad) * len;
|
||||
svgEl('line', { x1: startX, y1: startY, x2: e2x, y2: e2y, stroke: '#f4c94e', 'stroke-width': '2', 'stroke-linecap': 'round', opacity: '0.85' }, reflG);
|
||||
}
|
||||
valEl.textContent = s.albedo.toFixed(2).replace('.', ',');
|
||||
reflEl.textContent = Math.round(s.albedo * 100) + ' %';
|
||||
absEl.textContent = Math.round((1 - s.albedo) * 100) + ' %';
|
||||
root.querySelectorAll('.ge-albedo-choice .ge-btn').forEach(b => {
|
||||
b.classList.toggle('ge-btn-primary', b.dataset.key === s.key);
|
||||
});
|
||||
}
|
||||
root.querySelectorAll('.ge-albedo-choice .ge-btn').forEach(b => {
|
||||
b.addEventListener('click', () => setSurface(b.dataset.key));
|
||||
});
|
||||
setSurface('snow');
|
||||
}
|
||||
|
||||
// =====================================================================
|
||||
// Experiment: CO₂-Fußabdruck-Rechner — schneller Alltags-Schätzer
|
||||
// =====================================================================
|
||||
function footprintCalc(root) {
|
||||
root.innerHTML = `
|
||||
<div class="ge-wrap">
|
||||
<div class="ge-head">
|
||||
<h3>🧮 Schätze deinen CO₂-Fußabdruck</h3>
|
||||
<p>Einfache Auswahl pro Bereich. Das Ergebnis ist eine Richtgröße — kein genauer Wert.</p>
|
||||
</div>
|
||||
<div class="ge-calc">
|
||||
<div class="ge-calc-row">
|
||||
<div class="ge-calc-q">🏠 Wohnen</div>
|
||||
<div class="ge-calc-opts" data-key="home">
|
||||
<button class="ge-btn" data-val="1.0">Wärmepumpe / Fernwärme</button>
|
||||
<button class="ge-btn ge-btn-primary" data-val="2.0">Gas/Öl, mittlere Größe</button>
|
||||
<button class="ge-btn" data-val="3.5">Altbau, schlecht isoliert</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="ge-calc-row">
|
||||
<div class="ge-calc-q">🚗 Verkehr</div>
|
||||
<div class="ge-calc-opts" data-key="car">
|
||||
<button class="ge-btn" data-val="0.3">meist zu Fuß / Rad / ÖV</button>
|
||||
<button class="ge-btn ge-btn-primary" data-val="1.8">Pkw mittel, kein Flug</button>
|
||||
<button class="ge-btn" data-val="4.5">Pkw viel + 1 Fernflug/Jahr</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="ge-calc-row">
|
||||
<div class="ge-calc-q">🍽 Ernährung</div>
|
||||
<div class="ge-calc-opts" data-key="food">
|
||||
<button class="ge-btn" data-val="1.2">vegan / vegetarisch</button>
|
||||
<button class="ge-btn ge-btn-primary" data-val="1.8">gemischt, wenig Fleisch</button>
|
||||
<button class="ge-btn" data-val="2.6">viel Fleisch und Milchprodukte</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="ge-calc-row">
|
||||
<div class="ge-calc-q">🛒 Konsum</div>
|
||||
<div class="ge-calc-opts" data-key="shop">
|
||||
<button class="ge-btn" data-val="1.0">bewusst, wenig Neues</button>
|
||||
<button class="ge-btn ge-btn-primary" data-val="2.0">durchschnittlich</button>
|
||||
<button class="ge-btn" data-val="3.0">häufig Neues / Elektronik</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="ge-calc-result">
|
||||
<div>Dein geschätzter Fußabdruck:</div>
|
||||
<strong class="ge-calc-total">7,6 t CO₂ / Jahr</strong>
|
||||
<div class="ge-calc-bar"><div class="ge-calc-fill" style="width: 76%"></div></div>
|
||||
<div class="ge-calc-scale"><span>0 t</span><span>Welt-Ø 4,7</span><span>AT-Ø 7,7</span><span>10 t</span></div>
|
||||
<div class="ge-calc-label">Klimaneutral-Ziel: unter 1 t — Welt-Durchschnitt: 4,7 t — Österreich: 7,7 t.</div>
|
||||
</div>
|
||||
<p class="ge-note">Die Anteile decken sich mit den Haupt-Kategorien im Klimaschutzbericht 2024 des Umweltbundesamts Österreich. Details pro Kategorie unter <a href="?term=co2-fussabdruck#gl-source-3" class="gl-inline-link" data-key="co2-fussabdruck">CO₂-Fußabdruck</a>.</p>
|
||||
</div>
|
||||
`;
|
||||
const totals = { home: 2.0, car: 1.8, food: 1.8, shop: 2.0 };
|
||||
function update() {
|
||||
const sum = Object.values(totals).reduce((a, b) => a + b, 0);
|
||||
root.querySelector('.ge-calc-total').textContent = sum.toFixed(1).replace('.', ',') + ' t CO₂ / Jahr';
|
||||
const pct = Math.min(100, (sum / 10) * 100);
|
||||
root.querySelector('.ge-calc-fill').style.width = pct + '%';
|
||||
}
|
||||
root.querySelectorAll('.ge-calc-opts').forEach(group => {
|
||||
const key = group.dataset.key;
|
||||
group.querySelectorAll('.ge-btn').forEach(btn => {
|
||||
btn.addEventListener('click', () => {
|
||||
group.querySelectorAll('.ge-btn').forEach(b => b.classList.remove('ge-btn-primary'));
|
||||
btn.classList.add('ge-btn-primary');
|
||||
totals[key] = parseFloat(btn.dataset.val);
|
||||
update();
|
||||
});
|
||||
});
|
||||
});
|
||||
update();
|
||||
}
|
||||
|
||||
// Registry — Key entspricht key_slug aus DB
|
||||
window.GlossarExperiments = {
|
||||
'kilowattstunde': kwhRace,
|
||||
'ppm': ppmGrid,
|
||||
'albedo': albedoSlider,
|
||||
'co2-fussabdruck': footprintCalc
|
||||
};
|
||||
})();
|
||||
@@ -0,0 +1,120 @@
|
||||
# Glossar — Infografik-Audit (Stand 2026-04-18)
|
||||
|
||||
Durchsicht aller 28 Glossar-Einträge auf fehlende Vergleichsgrafiken. Priorität
|
||||
richtet sich nach didaktischer Wirkung für die Zielgruppe (10–16 Jahre).
|
||||
|
||||
## Vorhanden (7 SVGs)
|
||||
|
||||
| Begriff | Datei |
|
||||
|---------------------|--------------------------------------------|
|
||||
| ppm | `ppm-comparison.svg` |
|
||||
| Treibhauseffekt | `treibhauseffekt.svg` |
|
||||
| Fossile Brennstoffe | `fossile-brennstoffe-zeit.svg` |
|
||||
| Windenergie | `windrad-groessenvergleich.svg` |
|
||||
| CO₂-Fußabdruck | `co2-fussabdruck.svg` |
|
||||
| Albedo | `albedo-vergleich.svg` |
|
||||
| Kilowattstunde | `kwh-vergleich.svg` |
|
||||
|
||||
## Kandidaten — dringend empfohlen
|
||||
|
||||
Begriffe, bei denen eine Grafik das Verständnis messbar verbessert, weil der
|
||||
Inhalt visuell verankert ist oder Zahlen sonst abstrakt bleiben.
|
||||
|
||||
### 🔥 co2 — Keeling-Kurve 1750 → 2024
|
||||
Die CO₂-Konzentration seit 1750 als Kurve (280 → 422 ppm), optional mit Eiszeit-/
|
||||
Industrialisierungs-Markierungen. Idee: Mauna-Loa-Kurve didaktisch vereinfacht,
|
||||
Jahreszeiten-Schwingung sichtbar machen.
|
||||
|
||||
### 🔥 klimawandel — Temperaturanomalie 1900 → 2023
|
||||
Welt global (+1,15 °C) und Österreich (+3,1 °C) als zwei Linien in einem
|
||||
Diagramm. Klar zeigen, dass AT überproportional erwärmt wird.
|
||||
|
||||
### 🔥 kohlenstoffkreislauf — Reservoir-Flussdiagramm
|
||||
Atmosphäre (875 Gt) · Biosphäre (2.300 Gt) · Ozeane (38.000 Gt) · Fossile
|
||||
Lagerstätten — verbunden mit Pfeilen (Fotosynthese, Atmung, Verbrennung,
|
||||
CO₂-Austausch Meer). Klassische Fachgrafik.
|
||||
|
||||
### 🔥 fotosynthese — Schema Pflanze + Reaktion
|
||||
Baum/Blatt mit Pfeilen „6 CO₂ + 6 H₂O + Licht → Glukose + 6 O₂". Ein- und
|
||||
Ausgänge am Blatt sichtbar. Für 5.–7. Klasse essentiell.
|
||||
|
||||
### 🔥 energiemix — Strommix Österreich 2023
|
||||
Kuchen oder gestapelter Balken: 58 % Wasser · 11 % Wind · 8 % Biomasse ·
|
||||
7 % PV · 10 % Gas · 6 % Sonstige. Alternativ Vergleichsgrafik Strommix vs.
|
||||
Gesamtenergiemix (AT dominiert fossil, 62 %).
|
||||
|
||||
## Kandidaten — sinnvoll
|
||||
|
||||
### ⚡ methan — GWP-Vergleich
|
||||
Drei Balken: 1 kg CO₂ vs. 1 kg Methan (GWP-100 = 28×) vs. 1 kg Methan (GWP-20 =
|
||||
82×). Plus Atmosphären-Konzentration 720 → 1.930 ppb als kleiner Verlauf.
|
||||
|
||||
### ⚡ photovoltaik — Wirkungsschema Solarzelle
|
||||
Querschnitt Silizium-Modul mit Photonen → Elektronen. Rechts ein Ertrags-
|
||||
Vergleich: 1 m² Dach in Österreich ≈ 150 kWh/Jahr ≈ X Waschmaschinen.
|
||||
|
||||
### ⚡ wasserkraft — Querschnitt Lauf- vs. Speicherkraftwerk
|
||||
Zwei Kraftwerks-Schemen nebeneinander (Donau-Laufkraftwerk, Alpen-Speicher).
|
||||
Darunter Balken „Anteil am AT-Strom: 58 %".
|
||||
|
||||
### ⚡ kipppunkt — Tisch-Metapher + 16 Kippelemente-Karte
|
||||
Links: Ball auf Tischkante → fällt. Rechts: Weltkarte mit den 16 bekannten
|
||||
Kippelementen (Grönland, Amazonas, AMOC, …) markiert, gefärbt nach Schwellen-
|
||||
Temperatur. Quelle: Armstrong McKay et al. 2022.
|
||||
|
||||
### ⚡ biodiversitaet — Living Planet Index
|
||||
Linie: globale Wirbeltier-Populationen 1970 = 100 %, 2020 = 27 %. Darunter die
|
||||
Hauptursachen (Lebensraumverlust, Klima, …) als kleine Icon-Reihe.
|
||||
|
||||
### ⚡ permafrost — Karte + Bodenquerschnitt
|
||||
Zwei Teile: Weltkarte der Nordhalbkugel-Permafrost-Gebiete (14 Mio. km²);
|
||||
Bodenquerschnitt mit organischem Kohlenstoff-Anteil (1.500 Gt gespeichert =
|
||||
2× Atmosphäre).
|
||||
|
||||
### ⚡ treibhausgas — GWP-Balken + AT-Anteilstorte
|
||||
Balken-Vergleich der wichtigsten Treibhausgase (CO₂ = 1, CH₄ = 28, N₂O = 273,
|
||||
SF₆ = 23.500). Daneben kleine Torte AT 2023: 80 % CO₂ · 11 % CH₄ · 6 % N₂O ·
|
||||
Rest F-Gase.
|
||||
|
||||
## Kandidaten — optional
|
||||
|
||||
### 💡 klimaneutralitaet — Waage-Schema
|
||||
Waage: links Emissionen (Ausstoß), rechts Senken (Wald, Moore, Technik);
|
||||
Beschriftung AT 2040 / EU 2050.
|
||||
|
||||
### 💡 emissionen — AT-Sektoren-Balken 2023
|
||||
Horizontale Balken: Energie/Industrie 34 % · Verkehr 28 % · Gebäude 11 % ·
|
||||
Landwirtschaft 11 % · Rest. Gut didaktisch, aber thematisch Überlappung mit
|
||||
CO₂-Fußabdruck und Energiemix.
|
||||
|
||||
### 💡 erneuerbare-energie — Welt-Wachstum 2010 → 2023
|
||||
Stacked-Area-Chart: globale installierte Leistung Wind + PV, von ~200 GW auf
|
||||
~2.200 GW (×10). Reduktion der PV-Kosten (−90 %) als zweite Kurve.
|
||||
|
||||
### 💡 watt / kilowatt / megawatt — gemeinsame „Leistungsleiter"
|
||||
*Eine* Grafik, die auf allen drei Einheits-Einträgen verlinkt ist: logarithmische
|
||||
Skala mit Beispielen (LED 10 W · Wasserkocher 2 kW · E-Auto 150 kW · Windrad 6 MW ·
|
||||
Atomkraftwerk 1.400 MW). Spart drei Einzelgrafiken.
|
||||
|
||||
### 💡 co2-aequivalent — Moleküle mit Multiplikator
|
||||
1 Methan-Molekül ⟷ 28 CO₂-Moleküle visuell. Einfach, aber stark für das
|
||||
Verständnis.
|
||||
|
||||
## Nicht empfohlen
|
||||
|
||||
- **pariser-abkommen** — stark textbezogen; Grafik wäre dekorativ.
|
||||
- **nachhaltigkeit** — das Drei-Säulen-Modell oder die SDGs sind naheliegend,
|
||||
aber ohne klaren Mehrwert gegenüber dem Text. SDG-17-Icons unterliegen UN-
|
||||
Markennutzungsrechten.
|
||||
|
||||
## Zusammenfassung
|
||||
|
||||
| Priorität | Anzahl | Einträge |
|
||||
|-------------|--------|----------|
|
||||
| 🔥 dringend | 5 | co2 · klimawandel · kohlenstoffkreislauf · fotosynthese · energiemix |
|
||||
| ⚡ sinnvoll | 7 | methan · photovoltaik · wasserkraft · kipppunkt · biodiversitaet · permafrost · treibhausgas |
|
||||
| 💡 optional | 5 | klimaneutralitaet · emissionen · erneuerbare-energie · Watt-Leiter (3 Einträge) · co2-aequivalent |
|
||||
| ✗ nicht nötig | 2 | pariser-abkommen · nachhaltigkeit |
|
||||
|
||||
Insgesamt 17 zusätzliche SVG-Kandidaten, davon realistisch ca. 15 Grafiken
|
||||
(Watt-Leiter dient drei Einträgen).
|
||||
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,755 @@
|
||||
<?php
|
||||
/**
|
||||
* Glossar-Mindmap — Force-directed Graph aller Begriffe + Related-Verbindungen.
|
||||
*
|
||||
* Datenquelle: /php/api/glossar.php?graph=1
|
||||
* Modul-Metadaten: DB-Tabelle module_info (Admin-pflegbar)
|
||||
*/
|
||||
require_once __DIR__ . '/../php/config/app.php';
|
||||
require_once __DIR__ . '/../php/config/db.php';
|
||||
|
||||
$bp = BASE_PATH;
|
||||
$api = BASE_URL . '/php/api/glossar.php';
|
||||
|
||||
// Farben sind Design-Entscheidung — nicht in DB, hier pro Modul gemappt.
|
||||
$moduleColors = [
|
||||
'klima' => '#4a7c8a',
|
||||
'fluss' => '#5a8a5e',
|
||||
'heli' => '#e8833a',
|
||||
'stadt' => '#c85c4a',
|
||||
'regenwald' => '#3a6b3e',
|
||||
'erdbeben' => '#8a6a4a',
|
||||
'energiemix'=> '#c4a97a',
|
||||
'lieferketten'=> '#b07aa1',
|
||||
];
|
||||
$defaultColor = '#c4a97a';
|
||||
|
||||
// Icons + Titel aus module_info (Admin-pflegbar)
|
||||
$modDb = getDB()->query("
|
||||
SELECT module_id, title, icon, sort_order
|
||||
FROM module_info
|
||||
WHERE status IN ('aktiv', 'beta')
|
||||
ORDER BY sort_order, title
|
||||
")->fetchAll(PDO::FETCH_ASSOC);
|
||||
|
||||
$moduleMeta = [];
|
||||
foreach ($modDb as $m) {
|
||||
$moduleMeta[$m['module_id']] = [
|
||||
'icon' => $m['icon'] ?: '📘',
|
||||
'label' => $m['title'],
|
||||
'color' => $moduleColors[$m['module_id']] ?? $defaultColor,
|
||||
];
|
||||
}
|
||||
?><!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Glossar geograsim.at — Mindmap</title>
|
||||
<meta name="description" content="Interaktive Mindmap aller Glossar-Begriffe mit ihren Verbindungen. Navigation per Klick, Drag und Zoom.">
|
||||
<link rel="icon" type="image/svg+xml" href="<?= $bp ?>/favicon.svg">
|
||||
<link rel="icon" type="image/png" href="<?= $bp ?>/favicon-96x96.png" sizes="96x96">
|
||||
<link rel="stylesheet" href="<?= $bp ?>/assets/fonts/inter.css">
|
||||
<link rel="stylesheet" href="<?= $bp ?>/assets/css/design-system.css">
|
||||
<style>
|
||||
html, body { height: 100%; background: var(--ggs-bg); overflow: hidden; }
|
||||
body { display: flex; flex-direction: column; }
|
||||
|
||||
/* ===== Topbar ===== */
|
||||
.mm-topbar {
|
||||
background: var(--ggs-white);
|
||||
padding: .55rem 1.2rem;
|
||||
display: flex; align-items: center; gap: .8rem;
|
||||
border-bottom: 1px solid var(--ggs-border);
|
||||
flex-shrink: 0; z-index: 50;
|
||||
}
|
||||
.mm-topbar a { text-decoration: none; }
|
||||
.mm-topbar-brand { display: flex; align-items: center; }
|
||||
.mm-topbar-brand img { height: 40px; display: block; }
|
||||
.mm-topbar .spacer { flex: 1; }
|
||||
.mm-btn-sm {
|
||||
display: inline-flex; align-items: center; gap: .3rem;
|
||||
min-height: 40px; padding: .4rem .8rem;
|
||||
border: 1px solid var(--ggs-border);
|
||||
border-radius: var(--ggs-radius-sm); background: var(--ggs-white);
|
||||
font-size: .78rem; font-weight: 600; cursor: pointer;
|
||||
color: var(--ggs-text); font-family: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
.mm-btn-sm.primary { background: var(--ggs-fjord); color: var(--ggs-white); border-color: var(--ggs-fjord); }
|
||||
@media (hover: hover) {
|
||||
.mm-btn-sm:hover { background: var(--ggs-fjord-light); color: var(--ggs-fjord-dark); border-color: var(--ggs-fjord); }
|
||||
.mm-btn-sm.primary:hover { background: var(--ggs-fjord-dark); }
|
||||
}
|
||||
|
||||
/* ===== Viewport ===== */
|
||||
.mm-viewport {
|
||||
flex: 1; position: relative; overflow: hidden;
|
||||
background:
|
||||
radial-gradient(circle at 30% 20%, rgba(74,124,138,.05), transparent 60%),
|
||||
radial-gradient(circle at 70% 75%, rgba(90,138,94,.06), transparent 60%),
|
||||
var(--ggs-bg);
|
||||
}
|
||||
.mm-svg {
|
||||
width: 100%; height: 100%; display: block;
|
||||
cursor: grab; touch-action: none;
|
||||
}
|
||||
.mm-svg.dragging { cursor: grabbing; }
|
||||
|
||||
.mm-edge {
|
||||
stroke: #9fb9c1; stroke-width: 1; fill: none;
|
||||
transition: stroke-opacity .2s;
|
||||
stroke-opacity: .42;
|
||||
}
|
||||
.mm-edge.hi { stroke: var(--ggs-fjord-dark); stroke-opacity: .95; stroke-width: 2.2; }
|
||||
.mm-edge.dim { stroke-opacity: .1; }
|
||||
|
||||
.mm-node circle {
|
||||
stroke: var(--ggs-white); stroke-width: 2.5; cursor: pointer;
|
||||
transition: r .2s, stroke-width .2s;
|
||||
}
|
||||
.mm-node text {
|
||||
font-family: var(--ggs-font);
|
||||
font-size: 11px; font-weight: 700; fill: var(--ggs-fjord-dark);
|
||||
text-anchor: middle; pointer-events: none;
|
||||
paint-order: stroke; stroke: var(--ggs-bg); stroke-width: 3;
|
||||
}
|
||||
.mm-node.hi circle { stroke-width: 4; }
|
||||
.mm-node.hi text { font-size: 12.5px; }
|
||||
.mm-node.dim circle { opacity: .3; }
|
||||
.mm-node.dim text { opacity: .3; }
|
||||
.mm-node.has-img circle { stroke: var(--ggs-moss); stroke-dasharray: 3 2; }
|
||||
|
||||
/* ===== Overlay-Panels ===== */
|
||||
.mm-panel {
|
||||
position: absolute; background: var(--ggs-white);
|
||||
border: 1px solid var(--ggs-border); border-radius: var(--ggs-radius-md);
|
||||
box-shadow: var(--ggs-shadow-md); padding: .9rem 1rem;
|
||||
font-size: .82rem; z-index: 10;
|
||||
}
|
||||
/* Info & Suche links oben */
|
||||
.mm-info { top: 14px; left: 14px; width: 280px; }
|
||||
.mm-info h2 { font-size: 1.05rem; font-weight: 900; color: var(--ggs-fjord-dark); margin-bottom: .3rem; }
|
||||
.mm-info p { font-size: .75rem; color: var(--ggs-text-muted); line-height: 1.5; margin-bottom: .6rem; }
|
||||
.mm-search {
|
||||
width: 100%; padding: .45rem .7rem; border: 1.5px solid var(--ggs-border);
|
||||
border-radius: var(--ggs-radius-sm); font-family: inherit; font-size: .82rem;
|
||||
outline: none; transition: border-color .15s;
|
||||
}
|
||||
.mm-search:focus { border-color: var(--ggs-fjord); }
|
||||
.mm-stats { font-size: .7rem; color: var(--ggs-text-muted); margin-top: .5rem; }
|
||||
.mm-stats strong { color: var(--ggs-fjord-dark); font-weight: 700; }
|
||||
|
||||
/* Legende rechts oben */
|
||||
.mm-legend { top: 14px; right: 14px; min-width: 200px; }
|
||||
.mm-legend h3 { font-size: .72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: var(--ggs-text-muted); margin-bottom: .5rem; }
|
||||
.mm-legend-row { display: flex; align-items: center; gap: .4rem; font-size: .78rem; margin-bottom: .3rem; color: var(--ggs-text); }
|
||||
.mm-legend-dot { width: 14px; height: 14px; border-radius: 50%; flex-shrink: 0; }
|
||||
.mm-legend-emoji { font-size: 1rem; line-height: 1; width: 18px; text-align: center; }
|
||||
.mm-legend-hint { font-size: .68rem; color: var(--ggs-text-muted); margin-top: .6rem; border-top: 1px solid var(--ggs-border); padding-top: .5rem; line-height: 1.45; }
|
||||
|
||||
/* Zoom-Buttons rechts unten */
|
||||
.mm-zoom { bottom: 14px; right: 14px; display: flex; flex-direction: column; gap: .3rem; padding: .3rem; }
|
||||
.mm-zoom button {
|
||||
width: 36px; height: 36px; border: 0; background: var(--ggs-bg);
|
||||
border-radius: var(--ggs-radius-sm); font-size: 1.15rem; font-weight: 800;
|
||||
color: var(--ggs-fjord-dark); cursor: pointer;
|
||||
display: flex; align-items: center; justify-content: center;
|
||||
transition: background .15s;
|
||||
}
|
||||
@media (hover: hover) { .mm-zoom button:hover { background: var(--ggs-fjord-light); } }
|
||||
|
||||
/* Node-Popover */
|
||||
.mm-pop {
|
||||
position: absolute; width: 300px; z-index: 30;
|
||||
background: var(--ggs-white); border: 1px solid var(--ggs-border);
|
||||
border-radius: var(--ggs-radius-md); box-shadow: var(--ggs-shadow-lg);
|
||||
padding: 1rem; pointer-events: auto; display: none;
|
||||
}
|
||||
.mm-pop.open { display: block; }
|
||||
.mm-pop-close {
|
||||
position: absolute; top: 6px; right: 6px; width: 24px; height: 24px;
|
||||
border: 0; background: transparent; cursor: pointer;
|
||||
color: var(--ggs-text-muted); font-size: 1.1rem;
|
||||
border-radius: 50%;
|
||||
}
|
||||
@media (hover: hover) { .mm-pop-close:hover { background: var(--ggs-coral-light); color: var(--ggs-coral); } }
|
||||
.mm-pop-cat {
|
||||
display: inline-block; font-size: .62rem; font-weight: 800;
|
||||
text-transform: uppercase; letter-spacing: .06em;
|
||||
color: var(--ggs-fjord); background: var(--ggs-fjord-light);
|
||||
padding: 2px 8px; border-radius: var(--ggs-radius-pill); margin-bottom: .3rem;
|
||||
}
|
||||
.mm-pop-title { font-size: 1.05rem; font-weight: 900; color: var(--ggs-fjord-dark); margin-bottom: .3rem; padding-right: 26px; }
|
||||
.mm-pop-short { font-size: .85rem; color: var(--ggs-text); line-height: 1.5; margin-bottom: .7rem; }
|
||||
.mm-pop-mods { display: flex; gap: .25rem; margin-bottom: .7rem; }
|
||||
.mm-pop-mod {
|
||||
font-size: .65rem; padding: 2px 8px;
|
||||
background: var(--ggs-bg); border-radius: var(--ggs-radius-pill);
|
||||
color: var(--ggs-text-muted); font-weight: 600;
|
||||
}
|
||||
.mm-pop-actions { display: flex; flex-direction: column; gap: .3rem; }
|
||||
.mm-pop-btn {
|
||||
display: block; padding: .55rem .8rem; border-radius: var(--ggs-radius-sm);
|
||||
font-size: .82rem; font-weight: 700; text-decoration: none; text-align: left;
|
||||
border: 1.5px solid var(--ggs-border); color: var(--ggs-fjord-dark);
|
||||
background: var(--ggs-white); transition: all .15s;
|
||||
font-family: inherit; cursor: pointer;
|
||||
}
|
||||
.mm-pop-btn.primary { background: var(--ggs-fjord); color: var(--ggs-white); border-color: var(--ggs-fjord); }
|
||||
@media (hover: hover) {
|
||||
.mm-pop-btn:hover { border-color: var(--ggs-fjord); background: var(--ggs-fjord-light); color: var(--ggs-fjord); }
|
||||
.mm-pop-btn.primary:hover { background: var(--ggs-fjord-dark); border-color: var(--ggs-fjord-dark); color: var(--ggs-white); }
|
||||
}
|
||||
.mm-pop-btn small { display: block; font-size: .68rem; font-weight: 500; opacity: .75; margin-top: 1px; }
|
||||
.mm-pop-related { margin-top: .5rem; border-top: 1px solid var(--ggs-border); padding-top: .6rem; }
|
||||
.mm-pop-related-title { font-size: .65rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: var(--ggs-text-muted); margin-bottom: .3rem; }
|
||||
.mm-pop-related-list { display: flex; flex-wrap: wrap; gap: .25rem; }
|
||||
.mm-pop-related-list button {
|
||||
font-size: .72rem; padding: 2px 8px; border: 1px solid var(--ggs-border);
|
||||
background: var(--ggs-white); border-radius: var(--ggs-radius-pill);
|
||||
color: var(--ggs-fjord-dark); cursor: pointer; font-family: inherit;
|
||||
}
|
||||
@media (hover: hover) { .mm-pop-related-list button:hover { background: var(--ggs-fjord-light); border-color: var(--ggs-fjord); } }
|
||||
|
||||
/* Loading */
|
||||
.mm-loading {
|
||||
position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
|
||||
color: var(--ggs-text-muted); font-size: .9rem; background: var(--ggs-bg);
|
||||
}
|
||||
|
||||
@media (max-width: 700px) {
|
||||
.mm-info, .mm-legend { display: none; }
|
||||
.mm-pop { width: calc(100vw - 28px); }
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="mm-topbar">
|
||||
<a href="<?= $bp ?>/index.html" class="mm-topbar-brand">
|
||||
<img src="<?= $bp ?>/assets/img/geograsim_t.svg" alt="GeoGraSim">
|
||||
</a>
|
||||
<span class="spacer"></span>
|
||||
<a href="<?= $bp ?>/pages/glossar.php" class="mm-btn-sm">📖 Glossar-Liste</a>
|
||||
<a href="<?= $bp ?>/index.html" class="mm-btn-sm">Startseite</a>
|
||||
<a href="<?= $bp ?>/handbuch.html" class="mm-btn-sm">Handbuch</a>
|
||||
<a href="<?= $bp ?>/login.html" class="mm-btn-sm primary">Anmelden</a>
|
||||
</div>
|
||||
|
||||
<div class="mm-viewport" id="mm-viewport">
|
||||
<div class="mm-loading" id="mm-loading">Mindmap wird aufgebaut …</div>
|
||||
|
||||
<svg class="mm-svg" id="mm-svg" xmlns="http://www.w3.org/2000/svg">
|
||||
<g id="mm-scene">
|
||||
<g id="mm-edges"></g>
|
||||
<g id="mm-nodes"></g>
|
||||
</g>
|
||||
</svg>
|
||||
|
||||
<!-- Info-Panel links -->
|
||||
<div class="mm-panel mm-info">
|
||||
<h2>🧠 Glossar-Mindmap</h2>
|
||||
<p>Alle Begriffe und ihre Zusammenhänge auf einen Blick. Linien verbinden verwandte Begriffe.</p>
|
||||
<input id="mm-search" class="mm-search" type="search" placeholder="Begriff suchen …" autocomplete="off">
|
||||
<div class="mm-stats" id="mm-stats"></div>
|
||||
</div>
|
||||
|
||||
<!-- Legende rechts -->
|
||||
<div class="mm-panel mm-legend">
|
||||
<h3>Module</h3>
|
||||
<?php foreach ($moduleMeta as $id => $m): ?>
|
||||
<div class="mm-legend-row" data-module="<?= htmlspecialchars($id) ?>">
|
||||
<span class="mm-legend-dot" style="background:<?= $m['color'] ?>"></span>
|
||||
<span class="mm-legend-emoji"><?= $m['icon'] ?></span><?= htmlspecialchars($m['label']) ?>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
<div class="mm-legend-row" data-module="__default__">
|
||||
<span class="mm-legend-dot" style="background:<?= $defaultColor ?>"></span>
|
||||
<span class="mm-legend-emoji">📘</span>sonstige · Einheiten
|
||||
</div>
|
||||
<div class="mm-legend-hint">
|
||||
🖱 Ziehen, um Knoten zu bewegen<br>
|
||||
🔍 Scrollen zum Zoomen<br>
|
||||
🖐 Leere Fläche ziehen zum Verschieben<br>
|
||||
🌿 Gestrichelter Rand = Grafik vorhanden
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Zoom-Buttons -->
|
||||
<div class="mm-panel mm-zoom">
|
||||
<button id="mm-zoom-in" title="Hineinzoomen">+</button>
|
||||
<button id="mm-zoom-out" title="Herauszoomen">−</button>
|
||||
<button id="mm-zoom-fit" title="Alles einpassen">⛶</button>
|
||||
</div>
|
||||
|
||||
<!-- Node-Popover -->
|
||||
<div class="mm-pop" id="mm-pop">
|
||||
<button class="mm-pop-close" id="mm-pop-close" aria-label="Schließen">×</button>
|
||||
<div id="mm-pop-body"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
const API = <?= json_encode($api) ?>;
|
||||
const BP = <?= json_encode($bp) ?>;
|
||||
const PAGES = <?= json_encode(BASE_URL . '/pages') ?>;
|
||||
|
||||
// Modul-Metadaten aus DB (module_info): icon, label, color pro Modul
|
||||
const MODULE_META = <?= json_encode($moduleMeta, JSON_UNESCAPED_UNICODE) ?>;
|
||||
const DEFAULT_COLOR = <?= json_encode($defaultColor) ?>;
|
||||
const CATEGORY_LABEL = { klima:'Klima', einheit:'Einheit', energie:'Energie', stadt:'Stadt', wasser:'Wasser', geologie:'Geologie', wirtschaft:'Wirtschaft', biologie:'Biologie' };
|
||||
|
||||
function modIcon(m) { return (MODULE_META[m]?.icon) || '•'; }
|
||||
function modLabel(m) { return (MODULE_META[m]?.label) || m; }
|
||||
function modColor(m) { return (MODULE_META[m]?.color) || DEFAULT_COLOR; }
|
||||
|
||||
function esc(s) { return String(s ?? '').replace(/&/g,'&').replace(/</g,'<').replace(/>/g,'>').replace(/"/g,'"'); }
|
||||
function primaryColor(modules) {
|
||||
if (!modules || !modules.length) return DEFAULT_COLOR;
|
||||
// Priorität: klima > stadt > fluss > heli > regenwald > erster Treffer
|
||||
for (const m of ['klima','stadt','fluss','heli','regenwald']) {
|
||||
if (modules.includes(m) && MODULE_META[m]) return MODULE_META[m].color;
|
||||
}
|
||||
for (const m of modules) if (MODULE_META[m]) return MODULE_META[m].color;
|
||||
return DEFAULT_COLOR;
|
||||
}
|
||||
|
||||
// ============ STATE ============
|
||||
const STATE = {
|
||||
nodes: [], // {id, key_slug, title, short, category, modules, image_path, x, y, vx, vy, fixed}
|
||||
edges: [], // {a, b} IDs
|
||||
byId: new Map(),
|
||||
edgeSet: new Map(), // nodeId → Set of connected node IDs
|
||||
zoom: 1, panX: 0, panY: 0,
|
||||
dragging: null, // node being dragged
|
||||
panStart: null, // {x,y,panX,panY} during viewport pan
|
||||
width: 0, height: 0,
|
||||
highlightId: null
|
||||
};
|
||||
|
||||
// ============ LOAD ============
|
||||
async function load() {
|
||||
const res = await fetch(API + '?graph=1');
|
||||
const data = await res.json();
|
||||
STATE.nodes = data.nodes.map(n => ({
|
||||
...n,
|
||||
x: 0, y: 0, vx: 0, vy: 0, fixed: false
|
||||
}));
|
||||
STATE.edges = data.edges;
|
||||
STATE.byId = new Map(STATE.nodes.map(n => [n.id, n]));
|
||||
STATE.edgeSet = new Map();
|
||||
STATE.nodes.forEach(n => STATE.edgeSet.set(n.id, new Set()));
|
||||
STATE.edges.forEach(e => {
|
||||
if (STATE.edgeSet.has(e.a)) STATE.edgeSet.get(e.a).add(e.b);
|
||||
if (STATE.edgeSet.has(e.b)) STATE.edgeSet.get(e.b).add(e.a);
|
||||
});
|
||||
|
||||
// Viewport-Dimensionen
|
||||
resize();
|
||||
|
||||
// Initial-Positionen: Kreis um Mitte
|
||||
const cx = STATE.width / 2, cy = STATE.height / 2;
|
||||
const r = Math.min(STATE.width, STATE.height) * 0.35;
|
||||
STATE.nodes.forEach((n, i) => {
|
||||
const a = (i / STATE.nodes.length) * Math.PI * 2;
|
||||
n.x = cx + Math.cos(a) * r;
|
||||
n.y = cy + Math.sin(a) * r;
|
||||
});
|
||||
|
||||
document.getElementById('mm-loading').style.display = 'none';
|
||||
document.getElementById('mm-stats').innerHTML =
|
||||
`<strong>${STATE.nodes.length}</strong> Begriffe · <strong>${STATE.edges.length}</strong> Verbindungen`;
|
||||
|
||||
buildGraph();
|
||||
// Force-Simulation: viele Ticks initial, dann kontinuierlich
|
||||
for (let i = 0; i < 400; i++) simulate(0.92);
|
||||
render();
|
||||
// Soft-Simulation weiter laufen lassen für stabiles Einschwingen
|
||||
startAnim();
|
||||
}
|
||||
|
||||
// ============ FORCE SIMULATION ============
|
||||
function simulate(damping = 0.88) {
|
||||
const N = STATE.nodes.length;
|
||||
const K_REPEL = 18000; // Abstoßung zwischen allen Knoten
|
||||
const K_SPRING = 0.012; // Feder-Attraktion auf Kanten
|
||||
const L0 = 140; // Ziellänge der Federn
|
||||
const K_GRAV = 0.003; // Zentrumsanziehung
|
||||
const cx = STATE.width / 2, cy = STATE.height / 2;
|
||||
|
||||
// Kräfte auf Null setzen
|
||||
for (const n of STATE.nodes) { n.fx = 0; n.fy = 0; }
|
||||
|
||||
// Abstoßung (O(n²) — bei 25 Knoten kein Problem)
|
||||
for (let i = 0; i < N; i++) {
|
||||
const ni = STATE.nodes[i];
|
||||
for (let j = i + 1; j < N; j++) {
|
||||
const nj = STATE.nodes[j];
|
||||
let dx = ni.x - nj.x, dy = ni.y - nj.y;
|
||||
let d2 = dx*dx + dy*dy;
|
||||
if (d2 < 1) { d2 = 1; dx = Math.random()-.5; dy = Math.random()-.5; }
|
||||
const f = K_REPEL / d2;
|
||||
const d = Math.sqrt(d2);
|
||||
const fx = f * dx / d, fy = f * dy / d;
|
||||
ni.fx += fx; ni.fy += fy;
|
||||
nj.fx -= fx; nj.fy -= fy;
|
||||
}
|
||||
}
|
||||
|
||||
// Feder-Anziehung entlang Kanten
|
||||
for (const e of STATE.edges) {
|
||||
const a = STATE.byId.get(e.a), b = STATE.byId.get(e.b);
|
||||
if (!a || !b) continue;
|
||||
const dx = b.x - a.x, dy = b.y - a.y;
|
||||
const d = Math.sqrt(dx*dx + dy*dy) || 1;
|
||||
const f = K_SPRING * (d - L0);
|
||||
const fx = f * dx / d, fy = f * dy / d;
|
||||
a.fx += fx; a.fy += fy;
|
||||
b.fx -= fx; b.fy -= fy;
|
||||
}
|
||||
|
||||
// Zentrumsanziehung
|
||||
for (const n of STATE.nodes) {
|
||||
n.fx += (cx - n.x) * K_GRAV;
|
||||
n.fy += (cy - n.y) * K_GRAV;
|
||||
}
|
||||
|
||||
// Position updaten
|
||||
for (const n of STATE.nodes) {
|
||||
if (n.fixed) { n.vx = 0; n.vy = 0; continue; }
|
||||
n.vx = (n.vx + n.fx) * damping;
|
||||
n.vy = (n.vy + n.fy) * damping;
|
||||
// Geschwindigkeit cappen (stabiler)
|
||||
const v = Math.sqrt(n.vx*n.vx + n.vy*n.vy);
|
||||
if (v > 20) { n.vx *= 20/v; n.vy *= 20/v; }
|
||||
n.x += n.vx;
|
||||
n.y += n.vy;
|
||||
}
|
||||
}
|
||||
|
||||
// ============ RENDER ============
|
||||
const SVGNS = 'http://www.w3.org/2000/svg';
|
||||
|
||||
function buildGraph() {
|
||||
const edgesG = document.getElementById('mm-edges');
|
||||
const nodesG = document.getElementById('mm-nodes');
|
||||
edgesG.innerHTML = '';
|
||||
nodesG.innerHTML = '';
|
||||
|
||||
// Edges
|
||||
for (const e of STATE.edges) {
|
||||
const line = document.createElementNS(SVGNS, 'line');
|
||||
line.setAttribute('class', 'mm-edge');
|
||||
line.dataset.a = e.a;
|
||||
line.dataset.b = e.b;
|
||||
edgesG.appendChild(line);
|
||||
}
|
||||
|
||||
// Nodes
|
||||
for (const n of STATE.nodes) {
|
||||
const g = document.createElementNS(SVGNS, 'g');
|
||||
g.setAttribute('class', 'mm-node' + (n.image_path ? ' has-img' : ''));
|
||||
g.dataset.id = n.id;
|
||||
|
||||
const circle = document.createElementNS(SVGNS, 'circle');
|
||||
circle.setAttribute('r', nodeRadius(n));
|
||||
circle.setAttribute('fill', primaryColor(n.modules));
|
||||
|
||||
const text = document.createElementNS(SVGNS, 'text');
|
||||
text.setAttribute('dy', nodeRadius(n) + 15);
|
||||
text.textContent = n.title.length > 22 ? n.title.slice(0, 20) + '…' : n.title;
|
||||
|
||||
g.appendChild(circle);
|
||||
g.appendChild(text);
|
||||
nodesG.appendChild(g);
|
||||
|
||||
// Drag
|
||||
g.addEventListener('pointerdown', ev => startDrag(ev, n, g));
|
||||
g.addEventListener('click', ev => { ev.stopPropagation(); openPopover(n, g); });
|
||||
g.addEventListener('pointerenter', () => hoverNode(n.id));
|
||||
g.addEventListener('pointerleave', () => hoverNode(null));
|
||||
}
|
||||
}
|
||||
|
||||
function nodeRadius(n) {
|
||||
const deg = STATE.edgeSet.get(n.id)?.size || 0;
|
||||
return 10 + Math.min(deg, 8) * 1.5;
|
||||
}
|
||||
|
||||
function render() {
|
||||
const edgesG = document.getElementById('mm-edges');
|
||||
const nodesG = document.getElementById('mm-nodes');
|
||||
|
||||
for (const line of edgesG.children) {
|
||||
const a = STATE.byId.get(+line.dataset.a);
|
||||
const b = STATE.byId.get(+line.dataset.b);
|
||||
if (!a || !b) continue;
|
||||
line.setAttribute('x1', a.x);
|
||||
line.setAttribute('y1', a.y);
|
||||
line.setAttribute('x2', b.x);
|
||||
line.setAttribute('y2', b.y);
|
||||
}
|
||||
for (const g of nodesG.children) {
|
||||
const n = STATE.byId.get(+g.dataset.id);
|
||||
if (!n) continue;
|
||||
g.setAttribute('transform', `translate(${n.x}, ${n.y})`);
|
||||
}
|
||||
|
||||
document.getElementById('mm-scene').setAttribute(
|
||||
'transform',
|
||||
`translate(${STATE.panX}, ${STATE.panY}) scale(${STATE.zoom})`
|
||||
);
|
||||
}
|
||||
|
||||
let animFrame = null;
|
||||
function startAnim() {
|
||||
let tick = 0;
|
||||
function frame() {
|
||||
if (STATE.dragging || tick < 60) {
|
||||
simulate(0.85);
|
||||
render();
|
||||
}
|
||||
tick++;
|
||||
animFrame = requestAnimationFrame(frame);
|
||||
}
|
||||
animFrame = requestAnimationFrame(frame);
|
||||
}
|
||||
|
||||
// ============ HIGHLIGHTING ============
|
||||
function hoverNode(id) {
|
||||
if (STATE.dragging) return;
|
||||
STATE.highlightId = id;
|
||||
const neighbours = id ? STATE.edgeSet.get(id) || new Set() : null;
|
||||
|
||||
document.querySelectorAll('.mm-node').forEach(g => {
|
||||
const nid = +g.dataset.id;
|
||||
if (id === null) { g.classList.remove('hi','dim'); return; }
|
||||
if (nid === id) g.classList.add('hi');
|
||||
else g.classList.remove('hi');
|
||||
if (nid === id || neighbours.has(nid)) g.classList.remove('dim');
|
||||
else g.classList.add('dim');
|
||||
});
|
||||
document.querySelectorAll('.mm-edge').forEach(line => {
|
||||
const a = +line.dataset.a, b = +line.dataset.b;
|
||||
if (id === null) { line.classList.remove('hi','dim'); return; }
|
||||
if (a === id || b === id) { line.classList.add('hi'); line.classList.remove('dim'); }
|
||||
else { line.classList.remove('hi'); line.classList.add('dim'); }
|
||||
});
|
||||
}
|
||||
|
||||
// ============ DRAG + PAN + ZOOM ============
|
||||
const svg = document.getElementById('mm-svg');
|
||||
|
||||
function clientToScene(ev) {
|
||||
const pt = svg.createSVGPoint();
|
||||
pt.x = ev.clientX; pt.y = ev.clientY;
|
||||
const inv = svg.getScreenCTM().inverse();
|
||||
const svgP = pt.matrixTransform(inv);
|
||||
return {
|
||||
x: (svgP.x - STATE.panX) / STATE.zoom,
|
||||
y: (svgP.y - STATE.panY) / STATE.zoom
|
||||
};
|
||||
}
|
||||
|
||||
function startDrag(ev, node, el) {
|
||||
ev.preventDefault();
|
||||
ev.stopPropagation();
|
||||
STATE.dragging = { node, el, startX: node.x, startY: node.y, moved: false };
|
||||
el.setPointerCapture(ev.pointerId);
|
||||
node.fixed = true;
|
||||
svg.classList.add('dragging');
|
||||
}
|
||||
|
||||
svg.addEventListener('pointermove', ev => {
|
||||
if (STATE.dragging) {
|
||||
const p = clientToScene(ev);
|
||||
const n = STATE.dragging.node;
|
||||
if (Math.hypot(p.x - STATE.dragging.startX, p.y - STATE.dragging.startY) > 3) {
|
||||
STATE.dragging.moved = true;
|
||||
}
|
||||
n.x = p.x; n.y = p.y; n.vx = 0; n.vy = 0;
|
||||
render();
|
||||
} else if (STATE.panStart) {
|
||||
STATE.panX = STATE.panStart.panX + (ev.clientX - STATE.panStart.x);
|
||||
STATE.panY = STATE.panStart.panY + (ev.clientY - STATE.panStart.y);
|
||||
render();
|
||||
}
|
||||
});
|
||||
|
||||
svg.addEventListener('pointerup', ev => {
|
||||
if (STATE.dragging) {
|
||||
const { node, el, moved } = STATE.dragging;
|
||||
node.fixed = false;
|
||||
svg.classList.remove('dragging');
|
||||
el.releasePointerCapture?.(ev.pointerId);
|
||||
STATE.dragging = null;
|
||||
if (moved) ev.stopPropagation();
|
||||
}
|
||||
STATE.panStart = null;
|
||||
});
|
||||
|
||||
svg.addEventListener('pointerdown', ev => {
|
||||
if (ev.target.closest('.mm-node')) return;
|
||||
STATE.panStart = { x: ev.clientX, y: ev.clientY, panX: STATE.panX, panY: STATE.panY };
|
||||
svg.classList.add('dragging');
|
||||
closePopover();
|
||||
});
|
||||
|
||||
svg.addEventListener('pointerup', () => svg.classList.remove('dragging'));
|
||||
svg.addEventListener('pointerleave', () => { STATE.panStart = null; svg.classList.remove('dragging'); });
|
||||
|
||||
svg.addEventListener('wheel', ev => {
|
||||
ev.preventDefault();
|
||||
const rect = svg.getBoundingClientRect();
|
||||
const mx = ev.clientX - rect.left;
|
||||
const my = ev.clientY - rect.top;
|
||||
const factor = ev.deltaY < 0 ? 1.15 : 1/1.15;
|
||||
const newZoom = Math.max(0.25, Math.min(3, STATE.zoom * factor));
|
||||
// Zoom um Mauszeiger
|
||||
STATE.panX = mx - (mx - STATE.panX) * (newZoom / STATE.zoom);
|
||||
STATE.panY = my - (my - STATE.panY) * (newZoom / STATE.zoom);
|
||||
STATE.zoom = newZoom;
|
||||
render();
|
||||
}, { passive: false });
|
||||
|
||||
document.getElementById('mm-zoom-in').addEventListener('click', () => zoomBy(1.25));
|
||||
document.getElementById('mm-zoom-out').addEventListener('click', () => zoomBy(0.8));
|
||||
document.getElementById('mm-zoom-fit').addEventListener('click', fitToView);
|
||||
|
||||
function zoomBy(factor) {
|
||||
const cx = STATE.width/2, cy = STATE.height/2;
|
||||
const newZoom = Math.max(0.25, Math.min(3, STATE.zoom * factor));
|
||||
STATE.panX = cx - (cx - STATE.panX) * (newZoom / STATE.zoom);
|
||||
STATE.panY = cy - (cy - STATE.panY) * (newZoom / STATE.zoom);
|
||||
STATE.zoom = newZoom;
|
||||
render();
|
||||
}
|
||||
|
||||
function fitToView() {
|
||||
if (!STATE.nodes.length) return;
|
||||
let xs = STATE.nodes.map(n => n.x), ys = STATE.nodes.map(n => n.y);
|
||||
const minX = Math.min(...xs), maxX = Math.max(...xs);
|
||||
const minY = Math.min(...ys), maxY = Math.max(...ys);
|
||||
const bx = maxX - minX + 200, by = maxY - minY + 200;
|
||||
const z = Math.min(STATE.width / bx, STATE.height / by, 1.4);
|
||||
STATE.zoom = z;
|
||||
STATE.panX = STATE.width/2 - ((minX + maxX)/2) * z;
|
||||
STATE.panY = STATE.height/2 - ((minY + maxY)/2) * z;
|
||||
render();
|
||||
}
|
||||
|
||||
// ============ POPOVER ============
|
||||
const pop = document.getElementById('mm-pop');
|
||||
function openPopover(n, nodeEl) {
|
||||
if (STATE.dragging && STATE.dragging.moved) return;
|
||||
const rect = svg.getBoundingClientRect();
|
||||
const cx = rect.left + STATE.panX + n.x * STATE.zoom;
|
||||
const cy = rect.top + STATE.panY + n.y * STATE.zoom;
|
||||
|
||||
const body = document.getElementById('mm-pop-body');
|
||||
const modHtml = (n.modules || []).map(m =>
|
||||
`<span class="mm-pop-mod" style="color:${modColor(m)}">${modIcon(m)} ${esc(modLabel(m))}</span>`
|
||||
).join('');
|
||||
const cat = n.category ? (CATEGORY_LABEL[n.category] || n.category) : '';
|
||||
|
||||
// Verwandte: direkte Nachbarn laut edgeSet
|
||||
const neighbours = STATE.edgeSet.get(n.id) || new Set();
|
||||
const relHtml = [...neighbours].map(id => {
|
||||
const r = STATE.byId.get(id);
|
||||
return r ? `<button data-id="${r.id}">${esc(r.title)}</button>` : '';
|
||||
}).join('');
|
||||
|
||||
body.innerHTML = `
|
||||
${cat ? `<span class="mm-pop-cat">${esc(cat)}</span>` : ''}
|
||||
<div class="mm-pop-title">${esc(n.title)}</div>
|
||||
${n.short ? `<div class="mm-pop-short">${esc(n.short)}</div>` : ''}
|
||||
${modHtml ? `<div class="mm-pop-mods">${modHtml}</div>` : ''}
|
||||
<div class="mm-pop-actions">
|
||||
<a class="mm-pop-btn primary" href="${PAGES}/glossar.php?term=${encodeURIComponent(n.key_slug)}" target="_blank" rel="noopener">
|
||||
📖 Im Glossar öffnen
|
||||
<small>Vollständiger Eintrag: Text, Beispiele, Links, Grafik</small>
|
||||
</a>
|
||||
<button class="mm-pop-btn" id="mm-pop-center">
|
||||
🎯 Knoten zentrieren
|
||||
<small>Zoomt zu diesem Begriff und hebt Verbindungen hervor</small>
|
||||
</button>
|
||||
</div>
|
||||
${relHtml ? `<div class="mm-pop-related">
|
||||
<div class="mm-pop-related-title">Verbunden mit</div>
|
||||
<div class="mm-pop-related-list">${relHtml}</div>
|
||||
</div>` : ''}
|
||||
`;
|
||||
|
||||
// Positionieren: rechts neben Node wenn Platz, sonst links
|
||||
pop.classList.add('open');
|
||||
const pw = pop.offsetWidth;
|
||||
const ph = pop.offsetHeight;
|
||||
let px = cx + 30, py = cy - ph/2;
|
||||
if (px + pw > window.innerWidth - 10) px = cx - pw - 30;
|
||||
if (py < rect.top + 10) py = rect.top + 10;
|
||||
if (py + ph > window.innerHeight - 10) py = window.innerHeight - ph - 10;
|
||||
pop.style.left = px + 'px';
|
||||
pop.style.top = py + 'px';
|
||||
|
||||
hoverNode(n.id);
|
||||
|
||||
document.getElementById('mm-pop-center').addEventListener('click', () => {
|
||||
STATE.zoom = Math.max(STATE.zoom, 1.2);
|
||||
STATE.panX = STATE.width/2 - n.x * STATE.zoom;
|
||||
STATE.panY = STATE.height/2 - n.y * STATE.zoom;
|
||||
render();
|
||||
closePopover();
|
||||
});
|
||||
pop.querySelectorAll('.mm-pop-related-list button').forEach(btn => {
|
||||
btn.addEventListener('click', () => {
|
||||
const next = STATE.byId.get(+btn.dataset.id);
|
||||
if (next) openPopover(next, document.querySelector(`.mm-node[data-id="${next.id}"]`));
|
||||
});
|
||||
});
|
||||
}
|
||||
function closePopover() {
|
||||
pop.classList.remove('open');
|
||||
hoverNode(null);
|
||||
}
|
||||
document.getElementById('mm-pop-close').addEventListener('click', closePopover);
|
||||
document.addEventListener('keydown', ev => { if (ev.key === 'Escape') closePopover(); });
|
||||
|
||||
// ============ SUCHE ============
|
||||
document.getElementById('mm-search').addEventListener('input', ev => {
|
||||
const q = ev.target.value.trim().toLowerCase();
|
||||
if (!q) {
|
||||
document.querySelectorAll('.mm-node').forEach(g => g.classList.remove('hi','dim'));
|
||||
document.querySelectorAll('.mm-edge').forEach(l => l.classList.remove('hi','dim'));
|
||||
return;
|
||||
}
|
||||
const matches = new Set();
|
||||
STATE.nodes.forEach(n => {
|
||||
const hay = (n.title + ' ' + (n.short||'') + ' ' + n.key_slug).toLowerCase();
|
||||
if (hay.includes(q)) matches.add(n.id);
|
||||
});
|
||||
document.querySelectorAll('.mm-node').forEach(g => {
|
||||
const id = +g.dataset.id;
|
||||
if (matches.has(id)) { g.classList.add('hi'); g.classList.remove('dim'); }
|
||||
else { g.classList.remove('hi'); g.classList.add('dim'); }
|
||||
});
|
||||
document.querySelectorAll('.mm-edge').forEach(l => {
|
||||
const a = +l.dataset.a, b = +l.dataset.b;
|
||||
if (matches.has(a) && matches.has(b)) { l.classList.add('hi'); l.classList.remove('dim'); }
|
||||
else { l.classList.add('dim'); l.classList.remove('hi'); }
|
||||
});
|
||||
});
|
||||
|
||||
// ============ RESIZE ============
|
||||
function resize() {
|
||||
const vp = document.getElementById('mm-viewport');
|
||||
STATE.width = vp.clientWidth;
|
||||
STATE.height = vp.clientHeight;
|
||||
svg.setAttribute('viewBox', `0 0 ${STATE.width} ${STATE.height}`);
|
||||
}
|
||||
window.addEventListener('resize', () => { resize(); render(); });
|
||||
|
||||
load();
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,200 @@
|
||||
<?php
|
||||
/**
|
||||
* Glossar API
|
||||
* GET /api/glossar → alle Einträge (nur Kernfelder)
|
||||
* GET /api/glossar?key=co2 → einzelner Eintrag (volles Detail für Tooltip/Seite)
|
||||
* GET /api/glossar?module=klima → alle Einträge eines Moduls
|
||||
* GET /api/glossar?search=treibhaus → Volltextsuche
|
||||
*
|
||||
* POST /api/glossar (nur Admin) → neuer Eintrag (TODO)
|
||||
* PUT /api/glossar?id=42 (Admin) → bearbeiten (TODO)
|
||||
*/
|
||||
|
||||
require_once __DIR__ . '/../config/app.php';
|
||||
require_once __DIR__ . '/../config/db.php';
|
||||
|
||||
header('Content-Type: application/json; charset=utf-8');
|
||||
|
||||
$db = getDB();
|
||||
|
||||
// === Leichte Sprache ===
|
||||
// Priorität: ?easy=1|0 (explizit) > Schüler-Session mit students.easy_language=1 > normal
|
||||
if (session_status() === PHP_SESSION_NONE) session_start();
|
||||
$easy = false;
|
||||
if (isset($_GET['easy'])) {
|
||||
$easy = $_GET['easy'] === '1';
|
||||
} elseif (!empty($_SESSION['student_id'])) {
|
||||
if (!isset($_SESSION['_easy_cache']) || ($_SESSION['_easy_cache']['id'] ?? null) !== $_SESSION['student_id']) {
|
||||
$stmt = $db->prepare('SELECT easy_language FROM students WHERE id = ?');
|
||||
$stmt->execute([$_SESSION['student_id']]);
|
||||
$r = $stmt->fetch(PDO::FETCH_ASSOC);
|
||||
$_SESSION['_easy_cache'] = ['id' => $_SESSION['student_id'], 'val' => !empty($r['easy_language'])];
|
||||
}
|
||||
$easy = $_SESSION['_easy_cache']['val'];
|
||||
}
|
||||
// Cache pro Variante
|
||||
header($easy ? 'Cache-Control: private, max-age=60' : 'Cache-Control: public, max-age=600');
|
||||
|
||||
/** Liefert Easy-Variante, sonst Fallback auf normal */
|
||||
function pickText(array $row, string $normalKey, string $easyKey, bool $easy) {
|
||||
if ($easy && !empty($row[$easyKey])) return $row[$easyKey];
|
||||
return $row[$normalKey] ?? null;
|
||||
}
|
||||
|
||||
try {
|
||||
$method = $_SERVER['REQUEST_METHOD'];
|
||||
|
||||
if ($method === 'GET') {
|
||||
// Graph-Endpoint: alle Nodes + Edges für die Mindmap
|
||||
if (!empty($_GET['graph'])) {
|
||||
// Nodes inkl. Module-Zuordnung
|
||||
$nodes = $db->query('
|
||||
SELECT g.id, g.key_slug, g.title, g.short, g.category, g.image_path,
|
||||
GROUP_CONCAT(m.module_id) AS modules
|
||||
FROM glossar g
|
||||
LEFT JOIN glossar_modules m ON m.glossar_id = g.id
|
||||
GROUP BY g.id
|
||||
ORDER BY g.title
|
||||
')->fetchAll(PDO::FETCH_ASSOC);
|
||||
foreach ($nodes as &$n) {
|
||||
$n['modules'] = $n['modules'] ? explode(',', $n['modules']) : [];
|
||||
$n['id'] = (int) $n['id'];
|
||||
}
|
||||
unset($n);
|
||||
|
||||
// Edges: related-Tabelle — jede Kante einmal (kleinere id → grössere id)
|
||||
$edges = $db->query('
|
||||
SELECT LEAST(glossar_id, related_id) AS a, GREATEST(glossar_id, related_id) AS b
|
||||
FROM glossar_related
|
||||
GROUP BY a, b
|
||||
')->fetchAll(PDO::FETCH_ASSOC);
|
||||
foreach ($edges as &$e) {
|
||||
$e['a'] = (int) $e['a'];
|
||||
$e['b'] = (int) $e['b'];
|
||||
}
|
||||
unset($e);
|
||||
|
||||
echo json_encode(['nodes' => $nodes, 'edges' => $edges], JSON_UNESCAPED_UNICODE);
|
||||
exit;
|
||||
}
|
||||
|
||||
// Einzelner Eintrag per key_slug
|
||||
if (!empty($_GET['key'])) {
|
||||
$key = $_GET['key'];
|
||||
$entry = $db->prepare('SELECT * FROM glossar WHERE key_slug = ?');
|
||||
$entry->execute([$key]);
|
||||
$row = $entry->fetch(PDO::FETCH_ASSOC);
|
||||
if (!$row) {
|
||||
http_response_code(404);
|
||||
echo json_encode(['error' => 'not found']);
|
||||
exit;
|
||||
}
|
||||
|
||||
// Leichte Sprache: falls aktiv, short/text durch easy-Varianten ersetzen (Fallback auf normal)
|
||||
$row['short'] = pickText($row, 'short', 'short_easy', $easy);
|
||||
$row['text'] = pickText($row, 'text', 'text_easy', $easy);
|
||||
$row['_easy'] = $easy; // Meta-Info fürs Frontend
|
||||
// Roh-Easy-Felder entfernen, damit JSON schlank bleibt
|
||||
unset($row['short_easy'], $row['text_easy']);
|
||||
|
||||
// Module
|
||||
$mods = $db->prepare('SELECT module_id FROM glossar_modules WHERE glossar_id = ?');
|
||||
$mods->execute([$row['id']]);
|
||||
$row['modules'] = $mods->fetchAll(PDO::FETCH_COLUMN);
|
||||
|
||||
// Beispiele (inkl. optionaler Quellen-Referenz + Easy-Variante)
|
||||
$ex = $db->prepare('SELECT text, text_easy, source_ref FROM glossar_examples WHERE glossar_id = ? ORDER BY sort_order');
|
||||
$ex->execute([$row['id']]);
|
||||
$examples = $ex->fetchAll(PDO::FETCH_ASSOC);
|
||||
foreach ($examples as &$e) {
|
||||
$e['text'] = pickText($e, 'text', 'text_easy', $easy);
|
||||
unset($e['text_easy']);
|
||||
}
|
||||
unset($e);
|
||||
$row['examples'] = $examples;
|
||||
|
||||
// Quellen
|
||||
$sr = $db->prepare('SELECT ref_num, label, url, access_date FROM glossar_sources WHERE glossar_id = ? ORDER BY ref_num');
|
||||
$sr->execute([$row['id']]);
|
||||
$row['sources'] = $sr->fetchAll(PDO::FETCH_ASSOC);
|
||||
|
||||
// Links
|
||||
$lk = $db->prepare('SELECT label, url FROM glossar_links WHERE glossar_id = ? ORDER BY sort_order');
|
||||
$lk->execute([$row['id']]);
|
||||
$row['links'] = $lk->fetchAll(PDO::FETCH_ASSOC);
|
||||
|
||||
// Related (mit title + key)
|
||||
$rel = $db->prepare('
|
||||
SELECT g.key_slug, g.title
|
||||
FROM glossar_related r
|
||||
JOIN glossar g ON g.id = r.related_id
|
||||
WHERE r.glossar_id = ?
|
||||
');
|
||||
$rel->execute([$row['id']]);
|
||||
$row['related'] = $rel->fetchAll(PDO::FETCH_ASSOC);
|
||||
|
||||
echo json_encode($row, JSON_UNESCAPED_UNICODE);
|
||||
exit;
|
||||
}
|
||||
|
||||
// Alle Einträge eines Moduls
|
||||
if (!empty($_GET['module'])) {
|
||||
$mod = $_GET['module'];
|
||||
$stmt = $db->prepare('
|
||||
SELECT g.id, g.key_slug, g.title, g.short, g.short_easy, g.text, g.text_easy,
|
||||
g.unit, g.category, g.image_path, g.animation_path
|
||||
FROM glossar g
|
||||
JOIN glossar_modules m ON m.glossar_id = g.id
|
||||
WHERE m.module_id = ?
|
||||
ORDER BY g.title
|
||||
');
|
||||
$stmt->execute([$mod]);
|
||||
$rows = $stmt->fetchAll(PDO::FETCH_ASSOC);
|
||||
foreach ($rows as &$r) {
|
||||
$r['short'] = pickText($r, 'short', 'short_easy', $easy);
|
||||
$r['text'] = pickText($r, 'text', 'text_easy', $easy);
|
||||
unset($r['short_easy'], $r['text_easy']);
|
||||
}
|
||||
unset($r);
|
||||
echo json_encode($rows, JSON_UNESCAPED_UNICODE);
|
||||
exit;
|
||||
}
|
||||
|
||||
// Volltextsuche
|
||||
if (!empty($_GET['search'])) {
|
||||
$q = '%' . $_GET['search'] . '%';
|
||||
$stmt = $db->prepare('
|
||||
SELECT id, key_slug, title, short, category
|
||||
FROM glossar
|
||||
WHERE title LIKE ? OR short LIKE ? OR text LIKE ?
|
||||
ORDER BY title
|
||||
LIMIT 50
|
||||
');
|
||||
$stmt->execute([$q, $q, $q]);
|
||||
echo json_encode($stmt->fetchAll(PDO::FETCH_ASSOC), JSON_UNESCAPED_UNICODE);
|
||||
exit;
|
||||
}
|
||||
|
||||
// Alle Einträge (Übersicht) mit Modul-Zuordnungen
|
||||
$stmt = $db->query('
|
||||
SELECT g.id, g.key_slug, g.title, g.short, g.category, g.image_path,
|
||||
GROUP_CONCAT(m.module_id) AS modules
|
||||
FROM glossar g
|
||||
LEFT JOIN glossar_modules m ON m.glossar_id = g.id
|
||||
GROUP BY g.id
|
||||
ORDER BY g.title
|
||||
');
|
||||
$rows = $stmt->fetchAll(PDO::FETCH_ASSOC);
|
||||
foreach ($rows as &$r) {
|
||||
$r['modules'] = $r['modules'] ? explode(',', $r['modules']) : [];
|
||||
}
|
||||
echo json_encode($rows, JSON_UNESCAPED_UNICODE);
|
||||
exit;
|
||||
}
|
||||
|
||||
http_response_code(405);
|
||||
echo json_encode(['error' => 'method not allowed']);
|
||||
} catch (Throwable $e) {
|
||||
http_response_code(500);
|
||||
echo json_encode(['error' => $e->getMessage()]);
|
||||
}
|
||||
@@ -0,0 +1,658 @@
|
||||
<?php
|
||||
/**
|
||||
* Seed-Script: Leichte Sprache + neue Infografiken.
|
||||
* - Füllt short_easy, text_easy für jeden Glossar-Eintrag
|
||||
* - Füllt examples.text_easy pro Beispiel (nach sort_order)
|
||||
* - Setzt image_path für 12 neue Infografiken
|
||||
*
|
||||
* Regeln Leichte Sprache (Netzwerk Leichte Sprache, angepasst an 10–16 Jahre):
|
||||
* - Kurze Sätze (max. 10–12 Wörter)
|
||||
* - Einfache Wörter, aktiv, Hauptaussage zuerst
|
||||
* - Fremdwörter sofort erklären
|
||||
* - Zahlen als Ziffern, keine Metaphern, keine Ironie
|
||||
*
|
||||
* Aufruf: c:\xampp\php\php.exe App/php/seed_glossar_easy.php
|
||||
*/
|
||||
|
||||
require_once __DIR__ . '/config/db.php';
|
||||
|
||||
if (php_sapi_name() !== 'cli') {
|
||||
http_response_code(403);
|
||||
exit("CLI only.\n");
|
||||
}
|
||||
$db = getDB();
|
||||
$db->exec("SET NAMES utf8mb4 COLLATE utf8mb4_unicode_ci");
|
||||
|
||||
$updates = [
|
||||
|
||||
// ═══════════════════════════════════════════════════════════════════════
|
||||
[
|
||||
'key' => 'co2',
|
||||
'image' => 'assets/img/glossar/co2-keeling-kurve.svg',
|
||||
'short_easy' => 'CO₂ ist ein Gas. Es erwärmt die Erde.',
|
||||
'text_easy' => <<<'T'
|
||||
CO₂ heißt Kohlenstoffdioxid. CO₂ ist ein Gas. Man kann es nicht sehen. Man kann es nicht riechen.
|
||||
|
||||
CO₂ entsteht, wenn etwas verbrennt. Zum Beispiel Kohle, Öl oder Gas. Auch Menschen und Tiere atmen CO₂ aus. Pflanzen nehmen CO₂ aus der Luft auf. Sie brauchen es zum Wachsen.
|
||||
|
||||
Früher war wenig CO₂ in der Luft. Heute ist viel mehr CO₂ in der Luft. Der Grund: Wir verbrennen viel Öl und Kohle. Mehr CO₂ macht die Erde wärmer. Das ist der Klimawandel.
|
||||
T,
|
||||
'examples_easy' => [
|
||||
'Ein neues Auto macht rund 108 Gramm CO₂ pro Kilometer.',
|
||||
'Österreich hat 2023 rund 68 Millionen Tonnen CO₂ gemacht.',
|
||||
'Ein großer Baum bindet pro Jahr rund 10 Kilogramm CO₂.',
|
||||
'Ein Flug nach New York macht pro Person rund 1.800 Kilogramm CO₂.',
|
||||
],
|
||||
],
|
||||
|
||||
[
|
||||
'key' => 'co2-aequivalent',
|
||||
'image' => null,
|
||||
'short_easy' => 'Damit kann man alle Treibhausgase vergleichen.',
|
||||
'text_easy' => <<<'T'
|
||||
Es gibt viele Treibhausgase. Zum Beispiel CO₂ und Methan.
|
||||
|
||||
Manche Gase sind stärker als andere. Ein Kilo Methan wärmt die Erde so stark wie 28 Kilo CO₂. Damit man das vergleichen kann, rechnet man alles in CO₂-Äquivalente um.
|
||||
|
||||
Das heißt: Wie viel CO₂ wäre nötig, um die gleiche Wirkung zu haben? Länder berichten so ihre Treibhausgase. Die Einheit ist: Tonnen CO₂eq.
|
||||
T,
|
||||
'examples_easy' => [
|
||||
'1 Kilo Methan = 28 Kilo CO₂ auf 100 Jahre. In den ersten 20 Jahren ist Methan noch stärker.',
|
||||
'Österreich machte 2023 rund 68 Millionen Tonnen CO₂-Äquivalente.',
|
||||
'Ein Schaf rülpst pro Jahr rund 8 Kilo Methan. Das ist so viel wie 224 Kilo CO₂.',
|
||||
],
|
||||
],
|
||||
|
||||
[
|
||||
'key' => 'treibhausgas',
|
||||
'image' => 'assets/img/glossar/treibhausgas-gwp-balken.svg',
|
||||
'short_easy' => 'Ein Gas in der Luft, das die Erde wärmer macht.',
|
||||
'text_easy' => <<<'T'
|
||||
Treibhausgase sind bestimmte Gase in der Luft. Sie halten die Wärme der Erde fest. Ohne diese Gase wäre die Erde sehr kalt. Das ist der Treibhauseffekt.
|
||||
|
||||
Die wichtigsten Treibhausgase sind:
|
||||
- Wasserdampf (H₂O)
|
||||
- Kohlenstoffdioxid (CO₂)
|
||||
- Methan (CH₄)
|
||||
- Lachgas (N₂O)
|
||||
|
||||
Manche Gase wirken stärker als andere. Menschen machen vor allem mehr CO₂ und Methan. Das macht die Erde zu warm.
|
||||
T,
|
||||
'examples_easy' => [
|
||||
'Das Gas SF₆ ist sehr stark. 1 Kilo wirkt wie 23.500 Kilo CO₂.',
|
||||
'Wasserdampf ist das häufigste Treibhausgas. Menschen steuern es aber nicht direkt.',
|
||||
'In Österreich 2023: 80 % der Treibhausgase sind CO₂. 11 % sind Methan.',
|
||||
],
|
||||
],
|
||||
|
||||
[
|
||||
'key' => 'fotosynthese',
|
||||
'image' => 'assets/img/glossar/fotosynthese-schema.svg',
|
||||
'short_easy' => 'Pflanzen bauen aus Licht, Luft und Wasser Zucker.',
|
||||
'text_easy' => <<<'T'
|
||||
Pflanzen nehmen Sonnenlicht auf. Das machen sie in den grünen Blättern. Dort ist ein Stoff namens Chlorophyll.
|
||||
|
||||
Die Pflanze nimmt auch CO₂ aus der Luft auf. Und Wasser aus dem Boden. Mit dem Sonnenlicht macht sie daraus Zucker. Das ist die Nahrung der Pflanze. Als Rest gibt sie Sauerstoff ab.
|
||||
|
||||
Wir Menschen und Tiere brauchen Sauerstoff zum Atmen. Ohne Pflanzen gäbe es also keinen Sauerstoff in der Luft. Fotosynthese ist die Grundlage für alles Leben auf der Erde.
|
||||
T,
|
||||
'examples_easy' => [
|
||||
'Ein großer Laubbaum macht pro Jahr rund 10 bis 20 Kilo Sauerstoff.',
|
||||
'Kleine Algen im Meer machen die Hälfte des Sauerstoffs auf der Erde.',
|
||||
'Alle Pflanzen zusammen nehmen jedes Jahr rund 120 Milliarden Tonnen Kohlenstoff auf.',
|
||||
],
|
||||
],
|
||||
|
||||
[
|
||||
'key' => 'ppm',
|
||||
'image' => 'assets/img/glossar/ppm-comparison.svg',
|
||||
'short_easy' => 'ppm ist eine Einheit. Sie heißt: Teile pro Million.',
|
||||
'text_easy' => <<<'T'
|
||||
ppm kommt aus dem Englischen. Es heißt: parts per million. Das heißt: Teile pro Million.
|
||||
|
||||
1 ppm ist sehr wenig. Stell dir vor: Du hast 1.000.000 Teile Luft. Ein ppm ist davon nur 1 Teil. Das nutzt man für Gase in der Luft.
|
||||
|
||||
Früher waren 280 ppm CO₂ in der Luft. Heute sind es schon 422 ppm. Das ist viel mehr als früher.
|
||||
T,
|
||||
'examples_easy' => [
|
||||
'1 ppm ist wie 1 Tropfen Tinte in 50 Litern Wasser.',
|
||||
'1 ppm ist wie 1 Sekunde in 11 Tagen und 12 Stunden.',
|
||||
'1 ppm ist wie 1 Cent von 10.000 Euro.',
|
||||
'CO₂ vor 1850: 280 ppm. Heute: 422 ppm.',
|
||||
],
|
||||
],
|
||||
|
||||
[
|
||||
'key' => 'watt',
|
||||
'image' => null,
|
||||
'short_easy' => 'Watt ist eine Einheit. Sie misst elektrische Leistung.',
|
||||
'text_easy' => <<<'T'
|
||||
Watt hat die Abkürzung W. Watt misst Leistung. Leistung heißt: Wie viel Energie braucht ein Gerät pro Sekunde?
|
||||
|
||||
Je mehr Watt ein Gerät hat, desto stärker ist es. Eine LED-Lampe hat zum Beispiel 10 Watt. Ein Wasserkocher hat 2.000 Watt.
|
||||
|
||||
Für große Zahlen gibt es andere Einheiten: 1 Kilowatt (kW) = 1.000 Watt. 1 Megawatt (MW) = 1 Million Watt.
|
||||
|
||||
Watt ist benannt nach James Watt. Er hat die Dampfmaschine verbessert.
|
||||
T,
|
||||
'examples_easy' => [
|
||||
'Eine LED-Lampe braucht 5 bis 10 Watt.',
|
||||
'Ein Smartphone-Ladegerät hat rund 20 Watt.',
|
||||
'Ein Fernseher braucht 80 bis 150 Watt.',
|
||||
'Ein Mensch bringt beim Gehen rund 100 Watt Muskelkraft.',
|
||||
],
|
||||
],
|
||||
|
||||
[
|
||||
'key' => 'kilowatt',
|
||||
'image' => null,
|
||||
'short_easy' => '1 Kilowatt sind 1.000 Watt.',
|
||||
'text_easy' => <<<'T'
|
||||
Kilowatt hat die Abkürzung kW. 1 kW sind 1.000 Watt. Viele Geräte im Haushalt haben Kilowatt.
|
||||
|
||||
Ein Wasserkocher hat 2 kW. Ein Elektroauto-Motor hat 50 bis 300 kW.
|
||||
|
||||
Bei Solaranlagen nutzt man kWp. Das heißt: Kilowatt-peak. Es zeigt die Höchstleistung bei viel Sonne. In Österreich macht 1 kWp pro Jahr rund 1.000 kWh Strom.
|
||||
T,
|
||||
'examples_easy' => [
|
||||
'Ein Wasserkocher hat 2 kW.',
|
||||
'Ein Elektroauto von Tesla hat bis zu 377 kW.',
|
||||
'Ein Solardach auf einem Haus hat oft 5 bis 10 kWp.',
|
||||
'Ein Einfamilienhaus braucht rund 4.200 kWh Strom pro Jahr.',
|
||||
],
|
||||
],
|
||||
|
||||
[
|
||||
'key' => 'megawatt',
|
||||
'image' => null,
|
||||
'short_easy' => '1 Megawatt sind 1 Million Watt.',
|
||||
'text_easy' => <<<'T'
|
||||
Megawatt hat die Abkürzung MW. 1 MW sind 1.000.000 Watt. In Megawatt misst man große Kraftwerke.
|
||||
|
||||
Ein modernes Windrad hat 3 bis 6 MW. Ein Atomkraftwerk hat bis zu 1.600 MW. Das größte Wasserkraftwerk der Welt hat 22.500 MW.
|
||||
|
||||
1 MW Leistung reicht rund um die Uhr für 6 Einfamilienhäuser. Wind und Sonne arbeiten aber nicht immer. Darum ist der echte Ertrag niedriger.
|
||||
T,
|
||||
'examples_easy' => [
|
||||
'Ein modernes Windrad in Österreich hat 3 bis 6 MW.',
|
||||
'Das Kraftwerk Freudenau an der Donau hat 172 MW.',
|
||||
'Österreich hat zusammen 29.000 MW Leistung installiert.',
|
||||
'Das Pumpspeicherwerk Kops II in Vorarlberg hat 525 MW.',
|
||||
],
|
||||
],
|
||||
|
||||
[
|
||||
'key' => 'kilowattstunde',
|
||||
'image' => 'assets/img/glossar/kwh-vergleich.svg',
|
||||
'short_easy' => '1 kWh ist die Energie, die ein 1-kW-Gerät in 1 Stunde braucht.',
|
||||
'text_easy' => <<<'T'
|
||||
kWh bedeutet Kilowattstunde. Das ist eine Einheit für Energie.
|
||||
|
||||
Beispiel: Ein Wasserkocher hat 1 kW. Er läuft 1 Stunde lang. Dann hat er 1 kWh Strom gebraucht.
|
||||
|
||||
Strom-Rechnungen zählen in kWh. Auch Solaranlagen und E-Auto-Batterien. Eine kWh Strom kostet in Österreich rund 25 Cent.
|
||||
|
||||
Achtung: kW und kWh sind verschieden! kW zeigt die Stärke. kWh zeigt die Energiemenge. Wie km/h und km beim Auto.
|
||||
T,
|
||||
'examples_easy' => [
|
||||
'Ein Einfamilienhaus in Österreich braucht rund 4.200 kWh pro Jahr.',
|
||||
'1 kWh reicht für: 1 Waschmaschine oder 7 Stunden Fernsehen oder 7 km Elektroauto.',
|
||||
'Ein Handy voll laden braucht nur 0,015 kWh. Mit 1 kWh kannst du 65-mal laden.',
|
||||
'Österreich macht pro Jahr 74 Milliarden kWh Strom.',
|
||||
],
|
||||
],
|
||||
|
||||
[
|
||||
'key' => 'treibhauseffekt',
|
||||
'image' => 'assets/img/glossar/treibhauseffekt.svg',
|
||||
'short_easy' => 'Bestimmte Gase halten die Wärme der Erde fest.',
|
||||
'text_easy' => <<<'T'
|
||||
Die Sonne schickt Licht auf die Erde. Der Boden nimmt das Licht auf. Dann wird Wärme zurückgestrahlt.
|
||||
|
||||
Die Luft hat bestimmte Gase: die Treibhausgase. Diese Gase halten die Wärme fest. Das ist der Treibhauseffekt.
|
||||
|
||||
Ohne diese Gase wäre es auf der Erde minus 18 Grad. Mit den Gasen ist es plus 15 Grad. Das ist gut so!
|
||||
|
||||
Aber: Menschen machen jetzt immer mehr Treibhausgase. Zum Beispiel CO₂. Dadurch wird die Erde zu warm. Das ist der Klimawandel.
|
||||
T,
|
||||
'examples_easy' => [
|
||||
'Ohne Treibhauseffekt: minus 18 Grad auf der Erde.',
|
||||
'Mit Treibhauseffekt: plus 15 Grad.',
|
||||
'Auf dem Planeten Venus: plus 464 Grad. Dort ist der Treibhauseffekt extrem.',
|
||||
'Seit 1850 ist die Erde rund 1,2 Grad wärmer geworden.',
|
||||
],
|
||||
],
|
||||
|
||||
[
|
||||
'key' => 'klimawandel',
|
||||
'image' => 'assets/img/glossar/klimawandel-temperaturanomalie.svg',
|
||||
'short_easy' => 'Die Erde wird wärmer. Das Wetter ändert sich.',
|
||||
'text_easy' => <<<'T'
|
||||
Klima ist das durchschnittliche Wetter über 30 Jahre. Klimawandel heißt: Das Klima verändert sich.
|
||||
|
||||
Seit 1850 wird die Erde wärmer. Im Durchschnitt um 1,2 Grad. In Österreich sogar um 3,1 Grad! Das ist viel mehr als früher.
|
||||
|
||||
Der Grund ist der Mensch. Wir verbrennen viel Öl, Gas und Kohle. Dabei entsteht CO₂. CO₂ macht die Erde wärmer.
|
||||
|
||||
Folgen: Gletscher schmelzen. Es gibt mehr Hitzetage. Meere steigen. Stürme werden stärker.
|
||||
T,
|
||||
'examples_easy' => [
|
||||
'Die Erde ist bis 2023 rund 1,2 Grad wärmer als früher.',
|
||||
'Österreich ist seit 1900 rund 3,1 Grad wärmer. Das ist mehr als im Durchschnitt.',
|
||||
'Das Meer ist seit 1901 rund 20 Zentimeter gestiegen.',
|
||||
'Die Pasterze in Kärnten ist Österreichs größter Gletscher. Sie wird jedes Jahr kürzer.',
|
||||
],
|
||||
],
|
||||
|
||||
[
|
||||
'key' => 'klimaneutralitaet',
|
||||
'image' => null,
|
||||
'short_easy' => 'Man stößt nur so viele Treibhausgase aus, wie die Natur wieder aufnimmt.',
|
||||
'text_easy' => <<<'T'
|
||||
Klimaneutral bedeutet: Keine neuen Treibhausgase in die Luft. Alles was wir ausstoßen, muss wieder gebunden werden.
|
||||
|
||||
Zum Beispiel durch Wälder, Moore oder durch neue Technik. Nur so wird die Erde nicht weiter wärmer.
|
||||
|
||||
Österreich will bis 2040 klimaneutral sein. Die EU bis 2050.
|
||||
|
||||
Dafür müssen wir weniger Öl, Kohle und Gas verbrennen. Wir brauchen mehr Sonne, Wind und Wasser für den Strom.
|
||||
T,
|
||||
'examples_easy' => [
|
||||
'Österreich will bis 2040 klimaneutral sein.',
|
||||
'Die EU will bis 2050 klimaneutral sein.',
|
||||
'Ein Mensch in Österreich macht rund 7,7 Tonnen CO₂ pro Jahr. Klimaneutral wäre unter 1 Tonne.',
|
||||
'Ein Hektar Buchenwald bindet rund 10 Tonnen CO₂ pro Jahr.',
|
||||
],
|
||||
],
|
||||
|
||||
[
|
||||
'key' => 'erneuerbare-energie',
|
||||
'image' => null,
|
||||
'short_easy' => 'Energie aus Sonne, Wind, Wasser. Sie geht nie aus.',
|
||||
'text_easy' => <<<'T'
|
||||
Erneuerbare Energien sind Energien aus der Natur. Zum Beispiel:
|
||||
- Sonne (Photovoltaik)
|
||||
- Wind (Windräder)
|
||||
- Wasser (Wasserkraftwerke)
|
||||
- Erdwärme
|
||||
- Pflanzen (Biomasse)
|
||||
|
||||
Diese Quellen gehen nie aus. Bei ihrer Nutzung entsteht kein CO₂. Deshalb schützen sie das Klima.
|
||||
|
||||
Österreich hat viel Wasserkraft. 87 % des Stroms kommt aus erneuerbaren Quellen. Beim Gesamtverbrauch sind es erst 38 %. Denn Autos und Heizungen nutzen noch viel Öl und Gas.
|
||||
T,
|
||||
'examples_easy' => [
|
||||
'Österreich 2023: 87 % des Stroms aus erneuerbarer Energie.',
|
||||
'Deutschland 2023: rund 52 % des Stroms aus erneuerbarer Energie.',
|
||||
'Weltweit gibt es jetzt 10-mal so viel Wind und Sonne wie 2010.',
|
||||
'Eine Solaranlage kostet heute nur noch ein Zehntel von 2010.',
|
||||
],
|
||||
],
|
||||
|
||||
[
|
||||
'key' => 'fossile-brennstoffe',
|
||||
'image' => 'assets/img/glossar/fossile-brennstoffe-zeit.svg',
|
||||
'short_easy' => 'Kohle, Öl und Gas. Sie sind uralt.',
|
||||
'text_easy' => <<<'T'
|
||||
Fossile Brennstoffe sind Kohle, Erdöl und Erdgas.
|
||||
|
||||
Sie sind vor Millionen Jahren aus Pflanzen und kleinen Tieren entstanden. Unter hohem Druck im Boden sind sie zu Kohle, Öl und Gas geworden.
|
||||
|
||||
Wir verbrennen sie heute für Strom, Heizung und Autos. Dabei entsteht CO₂. Das macht die Erde wärmer.
|
||||
|
||||
Die Vorräte gehen aus. Und sie sind schlecht fürs Klima. Darum brauchen wir mehr erneuerbare Energie.
|
||||
T,
|
||||
'examples_easy' => [
|
||||
'Kohle entstand vor rund 300 Millionen Jahren.',
|
||||
'89 % der CO₂-Emissionen weltweit kommen aus Kohle, Öl und Gas.',
|
||||
'In Österreich kommen 62 % aller Energie noch aus Öl, Gas und Kohle.',
|
||||
'1 Liter Benzin wird zu 2,37 Kilo CO₂.',
|
||||
],
|
||||
],
|
||||
|
||||
[
|
||||
'key' => 'emissionen',
|
||||
'image' => null,
|
||||
'short_easy' => 'Gase oder Stoffe, die in die Luft gelangen.',
|
||||
'text_easy' => <<<'T'
|
||||
Emissionen sind Stoffe, die in die Umwelt kommen. Zum Beispiel aus dem Auspuff, aus Fabriken oder Heizungen.
|
||||
|
||||
Für das Klima sind vor allem Treibhausgase wichtig:
|
||||
- CO₂ aus Verbrennung
|
||||
- Methan aus Landwirtschaft und Erdgas
|
||||
- Lachgas aus Dünger
|
||||
|
||||
Jedes Land zählt seine Emissionen jedes Jahr. So weiß man, wie viel das Klima belastet wird.
|
||||
|
||||
Österreich hat 2023 rund 68 Millionen Tonnen CO₂ ausgestoßen.
|
||||
T,
|
||||
'examples_easy' => [
|
||||
'Österreich 2023: 68 Millionen Tonnen CO₂. Das ist weniger als 2022.',
|
||||
'Jeder Mensch in Österreich: rund 7,7 Tonnen CO₂ pro Jahr.',
|
||||
'Ein neues Auto: 108 Gramm CO₂ pro Kilometer.',
|
||||
'Alle Länder zusammen 2022: 53 Milliarden Tonnen CO₂.',
|
||||
],
|
||||
],
|
||||
|
||||
[
|
||||
'key' => 'photovoltaik',
|
||||
'image' => 'assets/img/glossar/photovoltaik-funktion.svg',
|
||||
'short_easy' => 'Sonnenlicht wird direkt zu Strom.',
|
||||
'text_easy' => <<<'T'
|
||||
Photovoltaik bedeutet: Licht wird zu Strom. Die Technik heißt kurz PV.
|
||||
|
||||
PV-Module bestehen aus Silizium. Wenn Sonnenlicht auftrifft, entsteht Strom.
|
||||
|
||||
Ein modernes Modul macht aus 100 Einheiten Licht rund 22 Einheiten Strom. Der Rest wird zu Wärme.
|
||||
|
||||
Solarmodule sind heute billig. Man kann sie auf Dächer, an Fassaden oder auf Felder bauen.
|
||||
T,
|
||||
'examples_easy' => [
|
||||
'Ein gutes PV-Modul macht aus 20 bis 23 Prozent des Lichts Strom.',
|
||||
'1 Quadratmeter Solardach macht in Österreich rund 170 kWh pro Jahr.',
|
||||
'Österreich hatte Ende 2023 schon 6.400 MW Solaranlagen.',
|
||||
'Weltweit kommen 5,5 Prozent des Stroms aus Photovoltaik.',
|
||||
],
|
||||
],
|
||||
|
||||
[
|
||||
'key' => 'windenergie',
|
||||
'image' => 'assets/img/glossar/windrad-groessenvergleich.svg',
|
||||
'short_easy' => 'Der Wind treibt ein Rad. Das Rad macht Strom.',
|
||||
'text_easy' => <<<'T'
|
||||
Ein Windrad hat drei große Flügel. Der Wind dreht die Flügel. Die Flügel drehen einen Generator. Der Generator macht Strom.
|
||||
|
||||
Moderne Windräder sind sehr groß. Die Spitze ist bis zu 240 Meter hoch. Ein Windrad macht Strom für rund 3.500 bis 5.000 Haushalte.
|
||||
|
||||
Windenergie passt gut zu Photovoltaik. Oft weht der Wind, wenn die Sonne gerade nicht scheint.
|
||||
T,
|
||||
'examples_easy' => [
|
||||
'Ein modernes Windrad in Österreich hat 3 bis 6 MW Leistung.',
|
||||
'Das größte Windrad auf dem Meer hat 15 MW.',
|
||||
'Österreich hatte Ende 2023 schon 1.432 Windräder.',
|
||||
'Ein Windrad macht pro Jahr 12 bis 18 Millionen kWh.',
|
||||
],
|
||||
],
|
||||
|
||||
[
|
||||
'key' => 'wasserkraft',
|
||||
'image' => 'assets/img/glossar/wasserkraft-querschnitt.svg',
|
||||
'short_easy' => 'Fließendes Wasser treibt eine Turbine. Die Turbine macht Strom.',
|
||||
'text_easy' => <<<'T'
|
||||
In einem Wasserkraftwerk fließt Wasser durch eine Turbine. Die Turbine dreht einen Generator. So entsteht Strom.
|
||||
|
||||
Es gibt zwei Arten:
|
||||
- Laufkraftwerke: Sie stehen am Fluss. Die Donau hat viele davon.
|
||||
- Speicherkraftwerke: Sie sammeln Wasser in einem Stausee. Bei Bedarf lassen sie es hinunter.
|
||||
|
||||
Wasserkraft macht immer Strom, auch nachts. In Österreich kommt mehr als die Hälfte des Stroms aus Wasserkraft.
|
||||
T,
|
||||
'examples_easy' => [
|
||||
'2023 in Österreich: 58 Prozent des Stroms aus Wasserkraft.',
|
||||
'Das Kraftwerk Freudenau in Wien hat 172 MW. Es reicht für 230.000 Haushalte.',
|
||||
'Das größte Wasserkraftwerk der Welt steht in China. Es heißt Drei-Schluchten-Damm.',
|
||||
'Das Pumpspeicherwerk Kaprun in Salzburg hat 833 MW.',
|
||||
],
|
||||
],
|
||||
|
||||
[
|
||||
'key' => 'biodiversitaet',
|
||||
'image' => 'assets/img/glossar/biodiversitaet-lpi.svg',
|
||||
'short_easy' => 'Die Vielfalt von Tieren, Pflanzen und Lebensräumen.',
|
||||
'text_easy' => <<<'T'
|
||||
Biodiversität bedeutet: Vielfalt des Lebens. Es gibt drei Arten davon:
|
||||
- viele verschiedene Arten (Tiere, Pflanzen, Pilze)
|
||||
- Vielfalt innerhalb einer Art (zum Beispiel viele Hunderassen)
|
||||
- viele verschiedene Lebensräume (Wald, Wiese, Meer)
|
||||
|
||||
Wir brauchen Vielfalt. Bienen bestäuben Obst. Wälder reinigen Wasser. Vielfalt hilft, dass die Natur stabil bleibt.
|
||||
|
||||
Viele Arten sind heute bedroht. Der Grund: Menschen zerstören Lebensräume. Auch der Klimawandel macht es schwer.
|
||||
T,
|
||||
'examples_easy' => [
|
||||
'Es gibt rund 2 Millionen bekannte Arten. Wahrscheinlich gibt es noch viel mehr.',
|
||||
'In Österreich leben rund 67.000 Tier- und Pflanzenarten.',
|
||||
'Seit 1970 gibt es 73 Prozent weniger wilde Wirbeltiere.',
|
||||
'Im Amazonas-Regenwald gibt es auf 1 Hektar mehr Baumarten als in ganz Mitteleuropa.',
|
||||
],
|
||||
],
|
||||
|
||||
[
|
||||
'key' => 'nachhaltigkeit',
|
||||
'image' => null,
|
||||
'short_easy' => 'So leben, dass auch später noch genug für alle da ist.',
|
||||
'text_easy' => <<<'T'
|
||||
Nachhaltig heißt: Wir verbrauchen nicht mehr, als die Natur nachliefern kann.
|
||||
|
||||
Der Begriff kommt aus dem Wald. Schon vor 300 Jahren galt: Schlage nur so viel Holz, wie nachwächst!
|
||||
|
||||
Nachhaltigkeit hat drei Teile:
|
||||
- Natur schützen
|
||||
- gerecht mit allen Menschen umgehen
|
||||
- Wirtschaft stabil halten
|
||||
|
||||
Die Vereinten Nationen haben dazu 17 Ziele. Zum Beispiel: keine Armut. Saubere Energie. Schutz der Natur.
|
||||
T,
|
||||
'examples_easy' => [
|
||||
'1713 schrieb Hans Carl von Carlowitz das erste Buch über Nachhaltigkeit.',
|
||||
'Die UN haben 17 Ziele für Nachhaltigkeit. Sie heißen SDGs.',
|
||||
'Earth Overshoot Day 2024: Am 1. August hatte die Welt schon zu viel verbraucht.',
|
||||
'In Österreich war der Tag schon am 7. April. Das ist sehr früh.',
|
||||
],
|
||||
],
|
||||
|
||||
[
|
||||
'key' => 'methan',
|
||||
'image' => 'assets/img/glossar/methan-gwp-vergleich.svg',
|
||||
'short_easy' => 'Ein starkes Treibhausgas. Stärker als CO₂.',
|
||||
'text_easy' => <<<'T'
|
||||
Methan hat die Formel CH₄. Es ist ein Gas. Es kommt in Erdgas vor.
|
||||
|
||||
Methan entsteht an vielen Orten:
|
||||
- im Magen von Kühen
|
||||
- in Reisfeldern
|
||||
- in Mülldeponien
|
||||
- in tauendem Permafrost
|
||||
|
||||
1 Kilo Methan wärmt die Erde so stark wie 28 Kilo CO₂ (in 100 Jahren). In den ersten 20 Jahren wirkt es sogar wie 82 Kilo CO₂.
|
||||
|
||||
Der Vorteil: Methan verschwindet nach rund 12 Jahren aus der Luft.
|
||||
T,
|
||||
'examples_easy' => [
|
||||
'1 Kilo Methan wirkt auf 100 Jahre wie 28 Kilo CO₂.',
|
||||
'Eine Kuh macht pro Jahr rund 100 Kilo Methan.',
|
||||
'In der Luft ist heute 2,6-mal mehr Methan als 1750.',
|
||||
'Im Permafrost liegen 1.500 Milliarden Tonnen Kohlenstoff. Das ist doppelt so viel wie in der Luft.',
|
||||
],
|
||||
],
|
||||
|
||||
[
|
||||
'key' => 'kohlenstoffkreislauf',
|
||||
'image' => 'assets/img/glossar/kohlenstoffkreislauf-schema.svg',
|
||||
'short_easy' => 'Kohlenstoff wandert: Luft, Pflanzen, Meer und Boden.',
|
||||
'text_easy' => <<<'T'
|
||||
Kohlenstoff ist in allen Lebewesen. Er wandert ständig zwischen vier Orten:
|
||||
- Luft (als CO₂)
|
||||
- Pflanzen und Boden
|
||||
- Meer
|
||||
- Tiefe Gesteine (Kohle, Öl, Gas)
|
||||
|
||||
Pflanzen nehmen CO₂ aus der Luft. Wenn sie verrotten, geht der Kohlenstoff zurück. Das ist ein Kreislauf.
|
||||
|
||||
Früher war dieser Kreislauf im Gleichgewicht. Menschen verbrennen aber viel Kohle und Öl. So kommt zu viel CO₂ in die Luft. Die Erde wird wärmer.
|
||||
T,
|
||||
'examples_easy' => [
|
||||
'In der Luft sind rund 875 Milliarden Tonnen Kohlenstoff als CO₂.',
|
||||
'Wälder und Böden speichern rund 2.300 Milliarden Tonnen Kohlenstoff.',
|
||||
'In den Ozeanen sind 38.000 Milliarden Tonnen Kohlenstoff gelöst.',
|
||||
'Menschen setzen pro Jahr rund 40 Milliarden Tonnen CO₂ zusätzlich frei.',
|
||||
],
|
||||
],
|
||||
|
||||
[
|
||||
'key' => 'albedo',
|
||||
'image' => 'assets/img/glossar/albedo-vergleich.svg',
|
||||
'short_easy' => 'Wie stark eine Fläche das Sonnenlicht zurückwirft.',
|
||||
'text_easy' => <<<'T'
|
||||
Albedo beschreibt, wie hell eine Fläche ist. Eine Zahl zeigt das:
|
||||
- 1,0 = alles Licht wird zurückgeworfen (wie ein Spiegel)
|
||||
- 0,0 = alles Licht wird geschluckt (ganz schwarz)
|
||||
|
||||
Schnee und Eis sind hell. Sie werfen viel Licht zurück. Wald und Meer sind dunkel. Sie schlucken viel Licht. Dadurch werden sie warm.
|
||||
|
||||
Wichtig fürs Klima: Wenn Eis schmilzt, liegt darunter dunkles Meer. Das Meer wird warm. So schmilzt noch mehr Eis. Das ist die Eis-Albedo-Rückkopplung.
|
||||
T,
|
||||
'examples_easy' => [
|
||||
'Frischer Schnee: Albedo 0,80 bis 0,90.',
|
||||
'Sandwüste: 0,30 bis 0,45.',
|
||||
'Wald: 0,10 bis 0,15.',
|
||||
'Offenes Meer: nur 0,06.',
|
||||
'Die Arktis wird 4-mal schneller warm als die Erde insgesamt.',
|
||||
],
|
||||
],
|
||||
|
||||
[
|
||||
'key' => 'kipppunkt',
|
||||
'image' => 'assets/img/glossar/kipppunkt-schema.svg',
|
||||
'short_easy' => 'Eine Grenze, ab der eine Veränderung nicht mehr aufzuhalten ist.',
|
||||
'text_easy' => <<<'T'
|
||||
Ein Kipppunkt ist ein Punkt, an dem etwas umkippt. Wie ein Tisch, den man umwirft. Er steht dann nicht mehr von selbst auf.
|
||||
|
||||
Im Klima gibt es 16 solche Kipppunkte. Zum Beispiel:
|
||||
- Das Eis in Grönland. Es schmilzt und kommt nicht zurück.
|
||||
- Der Amazonas-Regenwald. Er könnte zur Savanne werden.
|
||||
- Der Permafrost. Er taut und setzt Methan frei.
|
||||
- Die Meeresströmung AMOC. Sie könnte langsamer werden.
|
||||
|
||||
Ab 1,5 Grad Erwärmung ist das Risiko hoch. Je wärmer die Erde wird, desto gefährlicher.
|
||||
T,
|
||||
'examples_easy' => [
|
||||
'Grönland-Eisschild: Gefahr ab 1,5 bis 2,5 Grad Erwärmung.',
|
||||
'West-Antarktis: Gefahr schon ab 1,5 Grad. Langfristig könnte das Meer 5 Meter steigen.',
|
||||
'Amazonas-Regenwald: Gefahr bei 3,5 Grad oder 25 Prozent Rodung.',
|
||||
'Meeresströmung AMOC: Gefahr ab 1,4 Grad. Würde Europa kühler machen.',
|
||||
],
|
||||
],
|
||||
|
||||
[
|
||||
'key' => 'co2-fussabdruck',
|
||||
'image' => 'assets/img/glossar/co2-fussabdruck.svg',
|
||||
'short_easy' => 'Wie viel CO₂ du pro Jahr machst.',
|
||||
'text_easy' => <<<'T'
|
||||
Der CO₂-Fußabdruck sagt: Wie viel Treibhausgas verursacht dein Leben pro Jahr?
|
||||
|
||||
Vier Dinge sind wichtig:
|
||||
- Wohnen (Heizung, Strom)
|
||||
- Verkehr (Auto, Flugzeug)
|
||||
- Essen (besonders Fleisch und Milch)
|
||||
- Einkaufen (Kleidung, Handys)
|
||||
|
||||
In Österreich macht ein Mensch rund 7,7 Tonnen CO₂ pro Jahr. Das ist viel. Für das Klima-Ziel sollten wir nur 1 Tonne machen.
|
||||
|
||||
Viel hilft aber nicht nur persönlich. Der Staat muss auch bessere Bahnen, Wärmepumpen und Radwege bauen.
|
||||
T,
|
||||
'examples_easy' => [
|
||||
'Ein Mensch in Österreich: rund 7,7 Tonnen CO₂ pro Jahr.',
|
||||
'Welt-Durchschnitt: 4,7 Tonnen pro Person.',
|
||||
'USA: 14 Tonnen. Indien: 1,9 Tonnen.',
|
||||
'Flug Wien nach Bali und zurück: 3,5 Tonnen CO₂ pro Person.',
|
||||
'Wer kein Fleisch isst, spart rund 0,5 Tonnen CO₂ pro Jahr.',
|
||||
],
|
||||
],
|
||||
|
||||
[
|
||||
'key' => 'pariser-abkommen',
|
||||
'image' => null,
|
||||
'short_easy' => 'Ein Vertrag von 2015: Alle Länder wollen das Klima schützen.',
|
||||
'text_easy' => <<<'T'
|
||||
Das Pariser Abkommen ist ein Vertrag. Er wurde 2015 in Paris beschlossen. Fast alle Länder der Welt haben ihn unterschrieben.
|
||||
|
||||
Die Länder versprechen: Die Erde soll nicht zu warm werden. Nicht mehr als 2 Grad. Am besten nur 1,5 Grad.
|
||||
|
||||
Jedes Land sagt, wie viel Treibhausgas es einsparen will. Alle 5 Jahre wird das überprüft.
|
||||
|
||||
Problem: Die Länder tun noch zu wenig. Bei dem Tempo wird die Erde um 2,5 bis 2,9 Grad wärmer.
|
||||
T,
|
||||
'examples_easy' => [
|
||||
'196 Länder haben den Vertrag unterschrieben. Das sind fast alle.',
|
||||
'Der Vertrag gilt seit 4. November 2016.',
|
||||
'Bei dem heutigen Tempo wird die Erde 2,5 bis 2,9 Grad wärmer.',
|
||||
'Reiche Länder haben 100 Milliarden US-Dollar pro Jahr für arme Länder versprochen.',
|
||||
],
|
||||
],
|
||||
|
||||
[
|
||||
'key' => 'permafrost',
|
||||
'image' => 'assets/img/glossar/permafrost-karte.svg',
|
||||
'short_easy' => 'Boden, der das ganze Jahr gefroren ist.',
|
||||
'text_easy' => <<<'T'
|
||||
Permafrost bedeutet: Der Boden ist immer gefroren. Er taut auch im Sommer nicht auf.
|
||||
|
||||
Rund 15 Prozent vom Land im Norden sind Permafrost. Zum Beispiel in Sibirien, Alaska oder Nord-Kanada. Auch in den höchsten Alpen.
|
||||
|
||||
Im Permafrost liegen alte Pflanzenreste. Sie enthalten sehr viel Kohlenstoff. Das sind 1.500 Milliarden Tonnen. Doppelt so viel wie in der Luft.
|
||||
|
||||
Wenn der Boden taut, werden Bakterien aktiv. Sie geben CO₂ und Methan ab. So wird das Klima noch wärmer.
|
||||
T,
|
||||
'examples_easy' => [
|
||||
'Auf der Nordhalbkugel gibt es 14 Millionen km² Permafrost.',
|
||||
'In Sibirien ist der Boden bis zu 1.500 Meter tief gefroren.',
|
||||
'In den Alpen gibt es Permafrost ab rund 2.500 Meter Höhe.',
|
||||
'2017 stürzte in der Schweiz der Piz Cengalo ein. Grund: tauender Permafrost.',
|
||||
],
|
||||
],
|
||||
|
||||
[
|
||||
'key' => 'energiemix',
|
||||
'image' => 'assets/img/glossar/energiemix-at-2023.svg',
|
||||
'short_easy' => 'So ist die Energie eines Landes aufgeteilt.',
|
||||
'text_easy' => <<<'T'
|
||||
Der Energiemix zeigt: Woher kommt die Energie im Land? Man schaut drei Bereiche an:
|
||||
- Strom
|
||||
- Wärme (Heizung)
|
||||
- Verkehr
|
||||
|
||||
Österreichs Strom ist sehr grün: 84 Prozent aus erneuerbarer Energie. Die meiste davon ist Wasserkraft.
|
||||
|
||||
Aber: Insgesamt kommen noch 62 Prozent der Energie aus Öl, Gas und Kohle. Besonders Autos und viele Heizungen nutzen noch Öl und Gas.
|
||||
|
||||
Die Energiewende bedeutet: Weg von Öl und Gas. Hin zu Strom aus Sonne und Wind.
|
||||
T,
|
||||
'examples_easy' => [
|
||||
'Österreich-Strom 2023: 58 % Wasser, 11 % Wind, 7 % Sonne, 8 % Biomasse, 10 % Gas, 6 % Sonstiges.',
|
||||
'Österreich gesamt 2023: 38 % erneuerbar, 62 % fossil.',
|
||||
'Deutschland-Strom 2023: 31 % Wind, 12 % Sonne, 27 % Kohle, 14 % Gas.',
|
||||
'EU-Ziel 2030: 42,5 % erneuerbare Energie.',
|
||||
],
|
||||
],
|
||||
|
||||
];
|
||||
|
||||
// ═══════════════════════════════════════════════════════════════════════
|
||||
// AUSFÜHREN
|
||||
// ═══════════════════════════════════════════════════════════════════════
|
||||
|
||||
$uMain = $db->prepare('UPDATE glossar SET short_easy = ?, text_easy = ?, image_path = COALESCE(?, image_path) WHERE key_slug = ?');
|
||||
$uEx = $db->prepare('UPDATE glossar_examples SET text_easy = ? WHERE glossar_id = ? AND sort_order = ?');
|
||||
$look = $db->prepare('SELECT id FROM glossar WHERE key_slug = ?');
|
||||
|
||||
foreach ($updates as $u) {
|
||||
$look->execute([$u['key']]);
|
||||
$id = $look->fetchColumn();
|
||||
if (!$id) { echo "✗ {$u['key']} — Eintrag nicht gefunden\n"; continue; }
|
||||
|
||||
$uMain->execute([$u['short_easy'], $u['text_easy'], $u['image'] ?? null, $u['key']]);
|
||||
|
||||
foreach ($u['examples_easy'] as $i => $txt) {
|
||||
if ($txt === null) continue;
|
||||
$uEx->execute([$txt, $id, $i]);
|
||||
}
|
||||
$imgFlag = $u['image'] ? ' + Bild' : '';
|
||||
$exCnt = count(array_filter($u['examples_easy'], fn($x) => $x !== null));
|
||||
printf("[%3d] %-22s · Easy-Text · %d Beispiele%s\n", $id, $u['key'], $exCnt, $imgFlag);
|
||||
}
|
||||
|
||||
echo "\n✓ " . count($updates) . " Einträge mit Leichter Sprache versehen.\n";
|
||||
$totalEasy = $db->query("SELECT COUNT(*) FROM glossar WHERE text_easy IS NOT NULL AND text_easy != ''")->fetchColumn();
|
||||
$totalExEasy = $db->query("SELECT COUNT(*) FROM glossar_examples WHERE text_easy IS NOT NULL AND text_easy != ''")->fetchColumn();
|
||||
echo "Text-Varianten in DB: $totalEasy Haupttexte · $totalExEasy Beispiele\n";
|
||||
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,535 @@
|
||||
<?php
|
||||
/**
|
||||
* Seed-Script: 20 zentrale Klima-/Energiebegriffe ins Glossar einspielen.
|
||||
*
|
||||
* Aufruf (XAMPP): c:\xampp\php\php.exe App/php/seed_glossar_klima.php
|
||||
*
|
||||
* Upsert-Logik: vorhandene Einträge werden aktualisiert, neue angelegt.
|
||||
* Wichtig: Alle Umlaute kommen über diesen Pfad korrekt rein, weil
|
||||
* getDB() schon 'SET NAMES utf8mb4 COLLATE utf8mb4_unicode_ci' setzt.
|
||||
*
|
||||
* Diese Datei ist ein einmaliges Werkzeug und darf in Produktion nicht
|
||||
* aufgerufen werden. Sie ist idempotent — mehrmaliges Ausführen erzeugt
|
||||
* keine Duplikate.
|
||||
*/
|
||||
|
||||
require_once __DIR__ . '/config/db.php';
|
||||
|
||||
if (php_sapi_name() !== 'cli') {
|
||||
http_response_code(403);
|
||||
exit("CLI only.\n");
|
||||
}
|
||||
|
||||
$db = getDB();
|
||||
$db->exec("SET NAMES utf8mb4 COLLATE utf8mb4_unicode_ci");
|
||||
|
||||
$entries = [
|
||||
// ─────────────────────────────────────────────────────────────────────
|
||||
[
|
||||
'key_slug' => 'treibhauseffekt',
|
||||
'title' => 'Treibhauseffekt',
|
||||
'short' => 'Gase in der Atmosphäre halten Wärme zurück und erwärmen die Erde.',
|
||||
'text' => "Die Sonne schickt Licht zur Erde. Ein Teil davon wird vom Boden in Wärme umgewandelt und wieder abgestrahlt. Ohne Atmosphäre würde diese Wärme direkt ins All entweichen — die Erde wäre eisige -18 °C kalt.\nTreibhausgase wie CO₂, Methan und Wasserdampf wirken wie die Glasscheiben eines Gewächshauses: Sie lassen Sonnenlicht durch, halten die Wärmestrahlung aber teilweise zurück. Dadurch beträgt die Durchschnittstemperatur angenehme +15 °C. Dieser natürliche Treibhauseffekt macht Leben überhaupt möglich.\nDurch die Verbrennung fossiler Brennstoffe wird heute deutlich mehr CO₂ ausgestoßen als natürlich abgebaut werden kann. Die Atmosphäre hält mehr Wärme zurück — der zusätzliche, menschengemachte Treibhauseffekt erwärmt die Erde.",
|
||||
'unit' => null,
|
||||
'category' => 'klima',
|
||||
'image_path' => 'assets/img/glossar/treibhauseffekt.svg',
|
||||
'modules' => ['klima','stadt','fluss'],
|
||||
'examples' => [
|
||||
'Ohne Treibhauseffekt: -18 °C Durchschnittstemperatur · mit: +15 °C.',
|
||||
'Die Erde ist dadurch 33 °C wärmer, als sie ohne Atmosphäre wäre.',
|
||||
'Seit 1850 hat sich die Erde um rund 1,2 °C zusätzlich erwärmt.',
|
||||
'Venus hat einen extremen Treibhauseffekt — dort herrschen +465 °C.',
|
||||
],
|
||||
'links' => [
|
||||
['Wikipedia: Treibhauseffekt', 'https://de.wikipedia.org/wiki/Treibhauseffekt'],
|
||||
['Klimafakten.de', 'https://www.klimafakten.de/wissen/treibhauseffekt'],
|
||||
],
|
||||
'related' => ['co2','klimawandel','methan','albedo'],
|
||||
],
|
||||
// ─────────────────────────────────────────────────────────────────────
|
||||
[
|
||||
'key_slug' => 'klimawandel',
|
||||
'title' => 'Klimawandel',
|
||||
'short' => 'Langfristige Veränderung von Temperatur, Niederschlag und Wetter auf der Erde.',
|
||||
'text' => "Klima ist das durchschnittliche Wetter einer Region über mindestens 30 Jahre. Klimawandel bedeutet: Dieser Durchschnitt verändert sich messbar — Temperaturen steigen, Regenmuster verschieben sich, Extremwetter wird häufiger.\nErdgeschichtlich hat es Klimaschwankungen immer gegeben, ausgelöst durch Vulkane, Sonnenaktivität oder Bahnveränderungen der Erde. Der heutige Klimawandel ist jedoch eindeutig menschengemacht: Seit der Industrialisierung (ab ca. 1850) verbrennen wir fossile Brennstoffe und setzen dabei riesige Mengen CO₂ frei.\nFolgen in Österreich: Gletscher schmelzen, Hitzetage nehmen zu, Starkregen und Murenabgänge werden häufiger. Global sinken Inseln, steigt der Meeresspiegel und sterben Arten aus.",
|
||||
'unit' => 'Erwärmung in °C seit 1850',
|
||||
'category' => 'klima',
|
||||
'image_path' => null,
|
||||
'modules' => ['klima','stadt','fluss','regenwald'],
|
||||
'examples' => [
|
||||
'Österreichs Jahresmitteltemperatur: +3,1 °C seit 1900 (Zentralanstalt für Meteorologie).',
|
||||
'Pariser Ziel: Erwärmung unter 1,5 °C begrenzen.',
|
||||
'Meeresspiegel: seit 1900 um ca. 20 cm gestiegen.',
|
||||
'Pasterze (grösster AT-Gletscher): verliert 20–30 m Länge pro Jahr.',
|
||||
],
|
||||
'links' => [
|
||||
['Wikipedia: Klimawandel', 'https://de.wikipedia.org/wiki/Globale_Erw%C3%A4rmung'],
|
||||
['GeoSphere Austria: Klimastatus', 'https://www.geosphere.at/de/klima'],
|
||||
['IPCC Sachstandsberichte', 'https://www.ipcc.ch/'],
|
||||
],
|
||||
'related' => ['treibhauseffekt','co2','kipppunkt','pariser-abkommen'],
|
||||
],
|
||||
// ─────────────────────────────────────────────────────────────────────
|
||||
[
|
||||
'key_slug' => 'klimaneutralitaet',
|
||||
'title' => 'Klimaneutralität',
|
||||
'short' => 'Nicht mehr Treibhausgase ausstoßen, als die Natur wieder binden kann.',
|
||||
'text' => "Klimaneutral bedeutet: Unter dem Strich kommen keine neuen Treibhausgase in die Atmosphäre. Ausgestoßenes CO₂ wird entweder vermieden oder durch natürliche Senken (Wälder, Moore, Ozeane) sowie technische Verfahren wieder gebunden.\nEin klimaneutrales Land verbrennt idealerweise so wenig fossile Energie wie möglich, nutzt Strom aus Wind, Sonne und Wasser und kompensiert den Rest durch Aufforstung oder CO₂-Abscheidung. \"Kompensation\" allein reicht nicht — die Emissionen müssen drastisch sinken.\nÖsterreich will bis 2040 klimaneutral sein, die EU bis 2050. Das Pariser Abkommen setzt weltweit das Ziel, die Erderwärmung auf 1,5 °C zu begrenzen.",
|
||||
'unit' => null,
|
||||
'category' => 'klima',
|
||||
'image_path' => null,
|
||||
'modules' => ['klima','stadt'],
|
||||
'examples' => [
|
||||
'Österreich-Ziel: klimaneutral bis 2040 (Bundesregierung 2020).',
|
||||
'EU-Ziel: klimaneutral bis 2050 („European Green Deal").',
|
||||
'Pro Person in Österreich: aktuell ca. 8 Tonnen CO₂/Jahr — klimaneutral wäre unter 1 Tonne.',
|
||||
'Ein Hektar Wald bindet pro Jahr etwa 10 Tonnen CO₂.',
|
||||
],
|
||||
'links' => [
|
||||
['Wikipedia: Klimaneutralität', 'https://de.wikipedia.org/wiki/Klimaneutralit%C3%A4t'],
|
||||
['BMK: Klimaneutralität 2040', 'https://www.bmk.gv.at/themen/klima_umwelt/klimaschutz.html'],
|
||||
],
|
||||
'related' => ['co2','erneuerbare-energie','pariser-abkommen','co2-fussabdruck'],
|
||||
],
|
||||
// ─────────────────────────────────────────────────────────────────────
|
||||
[
|
||||
'key_slug' => 'erneuerbare-energie',
|
||||
'title' => 'Erneuerbare Energie',
|
||||
'short' => 'Energie aus Quellen, die sich laufend von selbst erneuern.',
|
||||
'text' => "Erneuerbare Energien nutzen Naturkräfte, die nicht aufgebraucht werden können: Sonne, Wind, Wasser, Erdwärme und Biomasse. Im Gegensatz zu Kohle, Öl und Gas setzen sie bei der Stromerzeugung kein CO₂ frei.\nZu den wichtigsten Formen gehören Photovoltaik (Sonnenlicht), Solarthermie (Sonnenwärme), Windkraft (Bewegung der Luft), Wasserkraft (fließendes Wasser), Geothermie (Wärme aus dem Erdinneren) und Biomasse (Holz, Biogas).\nÖsterreich hat europaweit einen sehr hohen Anteil erneuerbarer Energie — vor allem dank Wasserkraft aus den Alpen. Global müssen fossile Brennstoffe möglichst schnell durch Erneuerbare ersetzt werden, um den Klimawandel zu bremsen.",
|
||||
'unit' => null,
|
||||
'category' => 'energie',
|
||||
'image_path' => null,
|
||||
'modules' => ['klima','stadt'],
|
||||
'examples' => [
|
||||
'Österreich 2023: ca. 80 % des Stroms aus Erneuerbaren (v.a. Wasserkraft).',
|
||||
'Deutschland 2023: ca. 52 % erneuerbarer Stromanteil.',
|
||||
'Weltweit: erneuerbare Stromerzeugung wächst jährlich um 10 %.',
|
||||
'Ein durchschnittliches Einfamilienhaus in Österreich: 4.000 kWh Strom pro Jahr — Solardach auf 30 m² liefert ca. 4.500 kWh.',
|
||||
],
|
||||
'links' => [
|
||||
['Wikipedia: Erneuerbare Energien', 'https://de.wikipedia.org/wiki/Erneuerbare_Energien'],
|
||||
['E-Control Statistiken', 'https://www.e-control.at/statistik/strom'],
|
||||
],
|
||||
'related' => ['photovoltaik','windenergie','wasserkraft','energiemix','fossile-brennstoffe'],
|
||||
],
|
||||
// ─────────────────────────────────────────────────────────────────────
|
||||
[
|
||||
'key_slug' => 'fossile-brennstoffe',
|
||||
'title' => 'Fossile Brennstoffe',
|
||||
'short' => 'Kohle, Erdöl und Erdgas — über Millionen Jahre aus abgestorbenen Pflanzen entstanden.',
|
||||
'text' => "Fossile Brennstoffe sind Energieträger, die in Jahrmillionen aus abgestorbenen Pflanzen und Kleinlebewesen entstanden sind. Unter hohem Druck und Wärme in tiefen Erdschichten verwandelten sie sich in Kohle, Erdöl oder Erdgas.\nBei der Verbrennung wird der darin gespeicherte Kohlenstoff als CO₂ freigesetzt. Heute verbrennen wir in wenigen Jahrzehnten, was die Natur über Hundert Millionen Jahre gespeichert hat — deshalb steigt die CO₂-Konzentration in der Atmosphäre so rasant.\nFossile Brennstoffe sind endlich. Sie haben weltweit die Industrialisierung ermöglicht, sind aber Hauptursache des Klimawandels. Die Energiewende ersetzt sie durch erneuerbare Quellen.",
|
||||
'unit' => null,
|
||||
'category' => 'energie',
|
||||
'image_path' => 'assets/img/glossar/fossile-brennstoffe-zeit.svg',
|
||||
'modules' => ['klima','stadt'],
|
||||
'examples' => [
|
||||
'Erdöl entstand vor 50–500 Millionen Jahren — verbrannt wird es in Sekunden.',
|
||||
'1 Liter Benzin enthält den Energieertrag von 25 Tonnen Urzeit-Pflanzen.',
|
||||
'75 % der weltweiten CO₂-Emissionen stammen aus fossilen Brennstoffen.',
|
||||
'Österreich verbraucht jährlich ca. 8 Mio. Tonnen Erdöl (v.a. für Verkehr).',
|
||||
],
|
||||
'links' => [
|
||||
['Wikipedia: Fossile Energie', 'https://de.wikipedia.org/wiki/Fossile_Energie'],
|
||||
],
|
||||
'related' => ['co2','erneuerbare-energie','emissionen','klimawandel'],
|
||||
],
|
||||
// ─────────────────────────────────────────────────────────────────────
|
||||
[
|
||||
'key_slug' => 'emissionen',
|
||||
'title' => 'Emissionen',
|
||||
'short' => 'Stoffe, die aus Schornsteinen, Auspuffrohren oder Industrieanlagen in die Umwelt gelangen.',
|
||||
'text' => "Emissionen sind Gase, Partikel oder andere Stoffe, die aus einer Quelle in die Umwelt abgegeben werden — z.B. aus dem Auspuff eines Autos oder dem Kamin eines Kraftwerks.\nKlimarelevante Emissionen sind vor allem Treibhausgase: CO₂ aus Verbrennung, Methan aus Landwirtschaft und Erdgas-Lecks, Lachgas aus Düngemitteln. Diese werden zum Vergleich in \"CO₂-Äquivalenten\" angegeben.\nStädte, Länder und Unternehmen bilanzieren ihre Emissionen jährlich — das ist die Grundlage für Klimaschutz. Zur Einordnung: Österreich stößt rund 70 Mio. Tonnen CO₂-Äquivalente pro Jahr aus, weltweit sind es etwa 53 Mrd. Tonnen.",
|
||||
'unit' => 'CO₂-Äquivalente (CO₂eq) in Tonnen oder Mt',
|
||||
'category' => 'klima',
|
||||
'image_path' => null,
|
||||
'modules' => ['klima','stadt','fluss'],
|
||||
'examples' => [
|
||||
'Österreich 2023: ca. 70 Mt CO₂-Äquivalente pro Jahr (Umweltbundesamt).',
|
||||
'Pro Person in Österreich: rund 8 Tonnen CO₂/Jahr.',
|
||||
'Ein durchschnittliches Auto (10.000 km/Jahr): 1,6 Tonnen CO₂.',
|
||||
'Flug Wien–New York und zurück: 2,5 Tonnen CO₂ pro Person.',
|
||||
],
|
||||
'links' => [
|
||||
['Wikipedia: Emission', 'https://de.wikipedia.org/wiki/Emission_(Umwelt)'],
|
||||
['Umweltbundesamt: Treibhausgas-Bilanz', 'https://www.umweltbundesamt.at/klima/treibhausgase'],
|
||||
],
|
||||
'related' => ['co2','methan','co2-fussabdruck','klimaneutralitaet'],
|
||||
],
|
||||
// ─────────────────────────────────────────────────────────────────────
|
||||
[
|
||||
'key_slug' => 'photovoltaik',
|
||||
'title' => 'Photovoltaik (PV)',
|
||||
'short' => 'Technik, die Sonnenlicht direkt in elektrischen Strom umwandelt.',
|
||||
'text' => "Photovoltaik-Anlagen bestehen aus Solarzellen, die aus dem Halbleiter Silizium gefertigt sind. Trifft Sonnenlicht auf die Zellen, lösen die Lichtteilchen (Photonen) Elektronen aus — es fließt Strom.\nEine moderne PV-Zelle wandelt 20–23 % des einfallenden Sonnenlichts in Strom um. Der Rest wird zu Wärme oder durchgelassen. Moderne Module halten 25–30 Jahre und erzeugen in dieser Zeit ein Vielfaches der Energie, die ihre Herstellung gekostet hat.\nPhotovoltaik ist zur kostengünstigsten Form der Stromerzeugung geworden. Sie kann auf Hausdächern, an Fassaden, als Freiflächenanlage oder schwimmend auf Stauseen installiert werden.",
|
||||
'unit' => 'Leistung in kWp (Kilowattpeak) · Ertrag in kWh',
|
||||
'category' => 'energie',
|
||||
'image_path' => null,
|
||||
'modules' => ['klima','stadt'],
|
||||
'examples' => [
|
||||
'1 m² Solarpanel in Österreich: ca. 150–180 kWh/Jahr.',
|
||||
'Kleine Hausdach-Anlage (10 kWp ≈ 50 m²): ca. 10.000 kWh/Jahr — deckt 2 Haushalte.',
|
||||
'Ein grosser Solarpark (20 MWp ≈ 20 Fußballfelder): ca. 22.000 MWh/Jahr.',
|
||||
'Österreich 2024: rund 6.000 MWp installierte PV-Leistung.',
|
||||
],
|
||||
'links' => [
|
||||
['Wikipedia: Photovoltaik', 'https://de.wikipedia.org/wiki/Photovoltaik'],
|
||||
['BMK: Sonnenstrom', 'https://www.bmk.gv.at/themen/energie/energieversorgung/strom/pv.html'],
|
||||
],
|
||||
'related' => ['erneuerbare-energie','kilowatt','kilowattstunde','windenergie','wasserkraft'],
|
||||
],
|
||||
// ─────────────────────────────────────────────────────────────────────
|
||||
[
|
||||
'key_slug' => 'windenergie',
|
||||
'title' => 'Windenergie',
|
||||
'short' => 'Strom aus der Bewegung der Luft — erzeugt von großen Windrädern.',
|
||||
'text' => "Ein Windrad verwandelt die Bewegungsenergie des Windes in elektrischen Strom. Die Rotorblätter drehen sich, ein Getriebe überträgt die Bewegung auf einen Generator, der Strom produziert.\nModerne Windräder sind riesig: Die Nabe (Mittelpunkt) steht 100–160 m hoch, ein Rotorblatt ist bis zu 85 m lang. Ein einziges modernes Windrad hat 3–7 MW Leistung und kann jährlich Strom für rund 3.000–5.000 Haushalte erzeugen.\nWindenergie ist günstig, CO₂-frei und gut mit Solarstrom kombinierbar (Wind weht oft dann, wenn keine Sonne scheint). Offshore-Windparks auf dem Meer liefern besonders konstant Strom.",
|
||||
'unit' => 'Leistung in MW · Nabenhöhe in m',
|
||||
'category' => 'energie',
|
||||
'image_path' => 'assets/img/glossar/windrad-groessenvergleich.svg',
|
||||
'modules' => ['klima','stadt'],
|
||||
'examples' => [
|
||||
'Modernes Windrad: 3–7 MW, Höhe bis 240 m (Turm + Rotor).',
|
||||
'Ein Windrad erzeugt pro Jahr 8–20 Mio. kWh — Strom für 2.500–6.000 Haushalte.',
|
||||
'Österreich 2024: ca. 1.400 Windräder mit zusammen rund 3.900 MW Leistung.',
|
||||
'Zum Vergleich: Höchstes Gebäude Österreichs (DC Tower Wien): 220 m.',
|
||||
],
|
||||
'links' => [
|
||||
['Wikipedia: Windenergie', 'https://de.wikipedia.org/wiki/Windenergie'],
|
||||
['IG Windkraft Österreich', 'https://www.igwindkraft.at/'],
|
||||
],
|
||||
'related' => ['erneuerbare-energie','photovoltaik','wasserkraft','megawatt','kilowattstunde'],
|
||||
],
|
||||
// ─────────────────────────────────────────────────────────────────────
|
||||
[
|
||||
'key_slug' => 'wasserkraft',
|
||||
'title' => 'Wasserkraft',
|
||||
'short' => 'Strom aus fließendem oder fallendem Wasser — Österreichs wichtigste Stromquelle.',
|
||||
'text' => "Wasserkraftwerke nutzen die Bewegungsenergie von Flüssen oder den Höhenunterschied gestauten Wassers. Durch Turbinen fließendes Wasser treibt Generatoren an, die Strom erzeugen.\nUnterschieden werden Laufkraftwerke (kontinuierlicher Fluss, z.B. an der Donau) und Speicherkraftwerke (aufgestautes Wasser in Gebirgs-Stauseen, z.B. Kaprun). Speicherkraftwerke sind besonders wertvoll, weil sie kurzfristig zuschaltbar sind — ideal, um Solar- oder Windstrom auszugleichen.\nWasserkraft ist zuverlässig, langlebig (Anlagen halten 80+ Jahre) und CO₂-frei. In Österreich liefert sie über 60 % des gesamten Stroms — mehr als jede andere Quelle.",
|
||||
'unit' => 'Leistung in MW · Jahresertrag in GWh',
|
||||
'category' => 'energie',
|
||||
'image_path' => null,
|
||||
'modules' => ['klima','stadt','fluss'],
|
||||
'examples' => [
|
||||
'Österreich 2023: rund 60 % des Stroms aus Wasserkraft.',
|
||||
'Kraftwerk Freudenau (Wien): 172 MW Leistung, versorgt ca. 230.000 Haushalte.',
|
||||
'Drei Schluchten-Damm (China): 22.500 MW — weltgrößtes Wasserkraftwerk.',
|
||||
'Pumpspeicherwerk Kaprun: pumpt bei Überschuss-Strom Wasser bergauf — wie eine riesige Batterie.',
|
||||
],
|
||||
'links' => [
|
||||
['Wikipedia: Wasserkraft', 'https://de.wikipedia.org/wiki/Wasserkraft'],
|
||||
['VERBUND: Wasserkraft', 'https://www.verbund.com/de-at/ueber-verbund/strom-aus-wasserkraft'],
|
||||
],
|
||||
'related' => ['erneuerbare-energie','photovoltaik','windenergie','megawatt'],
|
||||
],
|
||||
// ─────────────────────────────────────────────────────────────────────
|
||||
[
|
||||
'key_slug' => 'biodiversitaet',
|
||||
'title' => 'Biodiversität',
|
||||
'short' => 'Die Vielfalt des Lebens — von Genen über Arten bis zu ganzen Lebensräumen.',
|
||||
'text' => "Biodiversität (biologische Vielfalt) umfasst drei Ebenen: die Vielfalt der Arten (z.B. Tiere, Pflanzen, Pilze), die Vielfalt innerhalb einer Art (genetische Unterschiede) und die Vielfalt der Lebensräume (Wälder, Wiesen, Moore, Flüsse).\nEine hohe Biodiversität macht Ökosysteme stabil: Sie bestäuben Nutzpflanzen, reinigen Wasser, binden CO₂ und liefern Nahrung und Medizin. Verliert ein System Arten, wird es anfälliger für Krisen.\nWeltweit nimmt die Biodiversität dramatisch ab: Lebensräume werden zerstört, das Klima ändert sich, invasive Arten verdrängen heimische. Wissenschaftler sprechen vom \"sechsten großen Artensterben\" der Erdgeschichte.",
|
||||
'unit' => null,
|
||||
'category' => 'biologie',
|
||||
'image_path' => null,
|
||||
'modules' => ['klima','regenwald','fluss'],
|
||||
'examples' => [
|
||||
'Weltweit bekannt: ca. 2 Millionen Arten — geschätzt gibt es 8–10 Millionen.',
|
||||
'Österreich: rund 67.000 nachgewiesene Tier- und Pflanzenarten.',
|
||||
'Globale Wirbeltier-Populationen: seit 1970 um 69 % zurückgegangen (WWF Living Planet Report 2022).',
|
||||
'Ein Hektar Regenwald beherbergt mehr Baumarten als ganz Mitteleuropa.',
|
||||
],
|
||||
'links' => [
|
||||
['Wikipedia: Biodiversität', 'https://de.wikipedia.org/wiki/Biodiversit%C3%A4t'],
|
||||
['WWF Living Planet Report', 'https://www.wwf.at/living-planet-report/'],
|
||||
],
|
||||
'related' => ['nachhaltigkeit','klimawandel','kipppunkt'],
|
||||
],
|
||||
// ─────────────────────────────────────────────────────────────────────
|
||||
[
|
||||
'key_slug' => 'nachhaltigkeit',
|
||||
'title' => 'Nachhaltigkeit',
|
||||
'short' => 'So leben und wirtschaften, dass auch künftige Generationen gut leben können.',
|
||||
'text' => "Der Begriff stammt ursprünglich aus dem Wald: Förster dürfen nur so viel Holz schlagen, wie nachwächst — sonst ist der Wald irgendwann weg. Übertragen auf unsere Gesellschaft: Wir dürfen die Erde nur so nutzen, dass sie langfristig erhalten bleibt.\nNachhaltigkeit hat drei Dimensionen: Ökologie (Natur schützen), Soziales (gerechtes Zusammenleben) und Wirtschaft (dauerhaft leistungsfähig). Eine Entscheidung ist nachhaltig, wenn alle drei langfristig funktionieren.\nDie UN haben 2015 17 Nachhaltigkeitsziele (\"SDGs\") beschlossen: keine Armut, saubere Energie, Klimaschutz, Bildung für alle und mehr. Sie gelten bis 2030 als Leitlinie für Politik und Wirtschaft weltweit.",
|
||||
'unit' => null,
|
||||
'category' => 'klima',
|
||||
'image_path' => null,
|
||||
'modules' => ['klima','stadt','regenwald'],
|
||||
'examples' => [
|
||||
'17 UN-Nachhaltigkeitsziele (SDGs) gelten bis 2030.',
|
||||
'„Earth Overshoot Day" 2024 (Welt): 1. August — danach verbraucht die Menschheit mehr, als die Erde erneuern kann.',
|
||||
'„Earth Overshoot Day" Österreich: bereits 7. April 2024.',
|
||||
'Hans Carl von Carlowitz prägte den Begriff 1713 für die Forstwirtschaft.',
|
||||
],
|
||||
'links' => [
|
||||
['Wikipedia: Nachhaltigkeit', 'https://de.wikipedia.org/wiki/Nachhaltigkeit'],
|
||||
['UN SDGs', 'https://www.un.org/sustainabledevelopment/'],
|
||||
],
|
||||
'related' => ['klimaneutralitaet','biodiversitaet','co2-fussabdruck'],
|
||||
],
|
||||
// ─────────────────────────────────────────────────────────────────────
|
||||
[
|
||||
'key_slug' => 'methan',
|
||||
'title' => 'Methan (CH₄)',
|
||||
'short' => 'Farb- und geruchloses Gas — ein viel stärkeres Treibhausgas als CO₂.',
|
||||
'text' => "Methan (chemisch CH₄) ist der Hauptbestandteil von Erdgas. Es entsteht überall dort, wo organisches Material ohne Sauerstoff abgebaut wird: in den Mägen von Rindern, in Reisfeldern, in Mülldeponien und in Sümpfen.\nEin Methan-Molekül hält in der Atmosphäre rund 80-mal mehr Wärme zurück als ein CO₂-Molekül (auf 20 Jahre gerechnet). Zum Glück baut sich Methan viel schneller ab — nach ca. 12 Jahren ist es weg. Das heißt: Wer Methanleckagen stopft, senkt die Temperatur schnell.\nDie größten Methanquellen sind heute Viehhaltung, Reis, Erdgas-Industrie (undichte Leitungen), Mülldeponien und tauender Permafrost. Letzterer ist besonders gefährlich — er könnte einen Kipppunkt auslösen.",
|
||||
'unit' => 'CH₄ · CO₂-Äquivalent (20 Jahre): ~80 · ppm in Atmosphäre',
|
||||
'category' => 'klima',
|
||||
'image_path' => null,
|
||||
'modules' => ['klima'],
|
||||
'examples' => [
|
||||
'1 kg Methan ≈ 80 kg CO₂ (Erwärmungswirkung auf 20 Jahre).',
|
||||
'Eine Kuh rülpst/furzt 100 kg Methan pro Jahr — entspricht 8.000 kg CO₂.',
|
||||
'Methan-Konzentration: 1850 ca. 700 ppb, heute über 1.900 ppb (Verdreifachung).',
|
||||
'Permafrost-Böden speichern 1.500 Mrd. Tonnen Kohlenstoff — 2× mehr als die Atmosphäre.',
|
||||
],
|
||||
'links' => [
|
||||
['Wikipedia: Methan', 'https://de.wikipedia.org/wiki/Methan'],
|
||||
['Global Methane Pledge', 'https://www.globalmethanepledge.org/'],
|
||||
],
|
||||
'related' => ['co2','treibhauseffekt','permafrost','emissionen'],
|
||||
],
|
||||
// ─────────────────────────────────────────────────────────────────────
|
||||
[
|
||||
'key_slug' => 'kohlenstoffkreislauf',
|
||||
'title' => 'Kohlenstoffkreislauf',
|
||||
'short' => 'Der ewige Weg des Kohlenstoffs zwischen Luft, Lebewesen, Boden und Meer.',
|
||||
'text' => "Kohlenstoff (C) ist der Grundbaustein allen Lebens. Er wandert ständig zwischen Atmosphäre, Pflanzen, Tieren, Böden und Ozeanen — der Kohlenstoffkreislauf ist der große Stoffwechsel der Erde.\nBeispiel: Eine Pflanze bindet CO₂ aus der Luft (Fotosynthese) und baut es in Blätter ein. Wird die Pflanze gefressen, geht der Kohlenstoff ins Tier über. Verrotten Pflanze oder Tier, wird der Kohlenstoff wieder frei. Im Ozean lösen sich CO₂ und werden von Meeresorganismen aufgenommen.\nBevor es Menschen gab, war dieser Kreislauf ausgeglichen: Was frei wurde, wurde wieder gebunden. Durch die Verbrennung fossiler Brennstoffe holen wir Kohlenstoff aus Jahrmillionen alten Lagern in den Kreislauf zurück — schneller, als Natur ihn wieder einlagern kann.",
|
||||
'unit' => 'Kohlenstoff in Gigatonnen (Gt C)',
|
||||
'category' => 'klima',
|
||||
'image_path' => null,
|
||||
'modules' => ['klima','regenwald'],
|
||||
'examples' => [
|
||||
'Atmosphäre enthält ca. 870 Gt Kohlenstoff als CO₂.',
|
||||
'Wälder und Böden speichern zusammen rund 2.300 Gt Kohlenstoff.',
|
||||
'Ozeane: ca. 38.000 Gt Kohlenstoff gelöst.',
|
||||
'Menschheit stößt pro Jahr ~10 Gt Kohlenstoff zusätzlich aus — der Kreislauf gerät aus dem Gleichgewicht.',
|
||||
],
|
||||
'links' => [
|
||||
['Wikipedia: Kohlenstoffzyklus', 'https://de.wikipedia.org/wiki/Kohlenstoffzyklus'],
|
||||
],
|
||||
'related' => ['co2','fossile-brennstoffe','biodiversitaet'],
|
||||
],
|
||||
// ─────────────────────────────────────────────────────────────────────
|
||||
[
|
||||
'key_slug' => 'albedo',
|
||||
'title' => 'Albedo',
|
||||
'short' => 'Rückstrahlvermögen einer Oberfläche — wie viel Sonnenlicht sie ins All zurückwirft.',
|
||||
'text' => "Die Albedo ist ein Maß für die Helligkeit einer Oberfläche. Eine Albedo von 1,0 bedeutet: 100 % des einfallenden Sonnenlichts wird reflektiert (perfekter Spiegel). Bei 0,0 wird alles absorbiert (perfekt schwarz).\nFrischer Schnee hat eine hohe Albedo (0,8–0,9) und reflektiert fast das gesamte Licht — deshalb blendet er so. Wald, Ozean und dunkle Asphaltstraßen absorbieren dagegen sehr viel Sonnenenergie und werden heiß.\nDie Albedo der Erde ist klimatisch entscheidend: Je mehr Eisflächen schmelzen und dunklem Ozean Platz machen, desto mehr Sonnenenergie wird absorbiert. Das beschleunigt die Erwärmung — ein Rückkopplungseffekt.",
|
||||
'unit' => 'Albedo 0,0–1,0 (dimensionslos)',
|
||||
'category' => 'klima',
|
||||
'image_path' => 'assets/img/glossar/albedo-vergleich.svg',
|
||||
'modules' => ['klima'],
|
||||
'examples' => [
|
||||
'Frischer Schnee: 0,80–0,90.',
|
||||
'Wüste/Sand: 0,30–0,40.',
|
||||
'Wald: 0,10–0,15.',
|
||||
'Ozean: 0,06 (sehr dunkel — absorbiert fast alles).',
|
||||
'Asphalt: 0,04–0,12 — deshalb werden Straßen im Sommer 60 °C heiß.',
|
||||
],
|
||||
'links' => [
|
||||
['Wikipedia: Albedo', 'https://de.wikipedia.org/wiki/Albedo'],
|
||||
],
|
||||
'related' => ['treibhauseffekt','kipppunkt','klimawandel'],
|
||||
],
|
||||
// ─────────────────────────────────────────────────────────────────────
|
||||
[
|
||||
'key_slug' => 'kipppunkt',
|
||||
'title' => 'Kipppunkt',
|
||||
'short' => 'Punkt, ab dem eine Veränderung nicht mehr aufzuhalten ist und von selbst weiterläuft.',
|
||||
'text' => "Ein Kipppunkt (englisch \"tipping point\") ist ein kritischer Schwellenwert im Klimasystem. Wird er überschritten, kippt ein Zustand unumkehrbar — wie ein umgeworfener Tisch, der nicht von selbst wieder steht.\nBeispiel Grönland-Eisschild: Taut es über eine bestimmte Temperatur hinaus, fließt Schmelzwasser ins Meer und das Eis sinkt in wärmere Luftschichten. Es schmilzt dann weiter, selbst wenn die Erde wieder kühler würde. Der Meeresspiegel steigt um bis zu 7 Meter.\nWissenschaftler haben 16 mögliche Kipppunkte identifiziert — darunter Amazonas-Regenwald (wird zur Savanne), Permafrost (setzt Methan frei), Atlantik-Strömungssystem (verlangsamt sich). Jeder bei unterschiedlicher Erwärmung erreicht — ab 1,5 °C steigt das Risiko deutlich.",
|
||||
'unit' => 'Erwärmungsschwelle in °C',
|
||||
'category' => 'klima',
|
||||
'image_path' => null,
|
||||
'modules' => ['klima'],
|
||||
'examples' => [
|
||||
'Grönland-Eisschild: Kipppunkt vermutlich bei 1,5–2,5 °C Erwärmung.',
|
||||
'West-Antarktis: ab ca. 1,5 °C — Meeresspiegel +5 m auf lange Sicht.',
|
||||
'Amazonas-Regenwald: ab ca. 3,5 °C oder 25 % Rodung.',
|
||||
'AMOC (Golfstrom-System): ab 1,5–4 °C — könnte Europa deutlich abkühlen.',
|
||||
],
|
||||
'links' => [
|
||||
['Wikipedia: Kippelement', 'https://de.wikipedia.org/wiki/Kippelemente_im_Erdklimasystem'],
|
||||
['PIK: Tipping Points', 'https://www.pik-potsdam.de/de/themen/erdsystemanalyse/kippelemente-im-erdsystem'],
|
||||
],
|
||||
'related' => ['klimawandel','permafrost','albedo','biodiversitaet'],
|
||||
],
|
||||
// ─────────────────────────────────────────────────────────────────────
|
||||
[
|
||||
'key_slug' => 'co2-fussabdruck',
|
||||
'title' => 'CO₂-Fußabdruck',
|
||||
'short' => 'Die gesamten Treibhausgas-Emissionen, die eine Person, ein Produkt oder ein Land verursacht.',
|
||||
'text' => "Der CO₂-Fußabdruck (engl. \"carbon footprint\") misst, wie viel Treibhausgas durch das Handeln einer Person, eines Produkts oder eines Landes in die Atmosphäre gelangt — gemessen in Tonnen CO₂-Äquivalenten pro Jahr.\nFür Personen zählen vier Hauptbereiche: Wohnen & Heizen, Mobilität (Auto, Flug), Ernährung (vor allem Fleisch), Konsum (Kleidung, Elektronik). Ein klimaneutrales Leben hätte nur etwa 1 Tonne CO₂ pro Jahr zur Folge — ein Zehntel des aktuellen Schnitts.\nDer Begriff wurde von der Öl-Industrie populär gemacht, um die Verantwortung auf Einzelpersonen zu verschieben. Wichtig: Individuelle Entscheidungen sind sinnvoll, strukturelle Veränderungen (Energiewende, ÖV-Ausbau) aber nötig.",
|
||||
'unit' => 't CO₂eq pro Jahr',
|
||||
'category' => 'klima',
|
||||
'image_path' => 'assets/img/glossar/co2-fussabdruck.svg',
|
||||
'modules' => ['klima','stadt'],
|
||||
'examples' => [
|
||||
'Österreich pro Kopf: ca. 8 t CO₂/Jahr (Wohnen 2, Verkehr 2, Ernährung 2, Konsum 2).',
|
||||
'Weltdurchschnitt: rund 4,7 t pro Kopf.',
|
||||
'USA: ca. 14 t pro Kopf · Indien: ca. 1,9 t.',
|
||||
'Flug Wien–Bali (einfach): 3,5 t — mehr als ein ganzes Klimaneutralitäts-Budget.',
|
||||
'Vegane Ernährung spart ca. 0,7–1 t CO₂ pro Jahr pro Person.',
|
||||
],
|
||||
'links' => [
|
||||
['Umweltbundesamt: CO₂-Rechner', 'https://secure.umweltbundesamt.at/co2mobil/'],
|
||||
['Our World in Data: Emissions', 'https://ourworldindata.org/co2-emissions'],
|
||||
],
|
||||
'related' => ['co2','emissionen','klimaneutralitaet','nachhaltigkeit'],
|
||||
],
|
||||
// ─────────────────────────────────────────────────────────────────────
|
||||
[
|
||||
'key_slug' => 'pariser-abkommen',
|
||||
'title' => 'Pariser Klimaabkommen',
|
||||
'short' => 'Internationaler Vertrag von 2015: Erderwärmung möglichst unter 1,5 °C halten.',
|
||||
'text' => "Das Pariser Abkommen wurde im Dezember 2015 bei der UN-Klimakonferenz in Paris von fast allen Staaten der Welt beschlossen. Kernziel: Die Erderwärmung gegenüber dem vorindustriellen Niveau (1850) auf deutlich unter 2 °C — möglichst 1,5 °C — begrenzen.\nJedes Land legt dafür eigene Klimaziele vor (\"Nationally Determined Contributions\", NDCs) und berichtet regelmäßig. Alle fünf Jahre werden die Ziele überprüft und ambitionierter gemacht.\nObwohl der Vertrag rechtlich bindend ist, fehlen Sanktionen. Aktuell sind die Zusagen noch nicht ausreichend: Mit den bisherigen Plänen steuert die Welt auf 2,5–3 °C Erwärmung zu — deshalb ist schnelles Handeln nötig.",
|
||||
'unit' => 'Erwärmungsziel: < 1,5 °C bzw. < 2 °C',
|
||||
'category' => 'klima',
|
||||
'image_path' => null,
|
||||
'modules' => ['klima'],
|
||||
'examples' => [
|
||||
'Unterzeichner: 195 Länder (fast alle UN-Mitgliedsstaaten).',
|
||||
'Zielzeitpunkt: weltweite Klimaneutralität „in der zweiten Hälfte des 21. Jahrhunderts".',
|
||||
'Aktueller Pfad laut UNEP Gap Report: rund 2,5–2,9 °C Erwärmung bis 2100.',
|
||||
'Finanzielles Ziel: 100 Mrd. USD/Jahr für arme Länder (Klimafinanzierung).',
|
||||
],
|
||||
'links' => [
|
||||
['Wikipedia: Übereinkommen von Paris', 'https://de.wikipedia.org/wiki/%C3%9Cbereinkommen_von_Paris'],
|
||||
['UNFCCC: Paris Agreement', 'https://unfccc.int/process-and-meetings/the-paris-agreement'],
|
||||
],
|
||||
'related' => ['klimaneutralitaet','klimawandel','emissionen'],
|
||||
],
|
||||
// ─────────────────────────────────────────────────────────────────────
|
||||
[
|
||||
'key_slug' => 'permafrost',
|
||||
'title' => 'Permafrost',
|
||||
'short' => 'Dauerhaft gefrorener Boden — große Flächen in Sibirien, Alaska und den Alpen.',
|
||||
'text' => "Permafrost ist Boden, der seit mindestens zwei Jahren ununterbrochen gefroren ist. Er bedeckt rund 15 % der Landfläche der Nordhalbkugel — vor allem Sibirien, Alaska, Nordkanada und die höchsten Bereiche der Alpen.\nIn ihm sind riesige Mengen uralter Pflanzenreste eingefroren, und damit auch Kohlenstoff. Taut der Boden auf, beginnen Mikroben diese Reste abzubauen und setzen CO₂ und Methan frei — ein klimatischer Rückkopplungseffekt, der die Erwärmung beschleunigt.\nIn den Alpen destabilisiert tauender Permafrost Berghänge: Felsen, die von Eis zusammengehalten wurden, stürzen ab. Im hohen Norden sinken Häuser, Straßen und Pipelines ein, weil der Boden ihren Halt verliert.",
|
||||
'unit' => 'Bodentiefe in m · Jahresmitteltemperatur < 0 °C',
|
||||
'category' => 'geologie',
|
||||
'image_path' => null,
|
||||
'modules' => ['klima'],
|
||||
'examples' => [
|
||||
'Nordhalbkugel: ca. 15 Mio. km² Permafrostfläche (ca. 1,6× so gross wie Kanada).',
|
||||
'Sibirischer Permafrost: bis zu 1.500 m tief gefroren.',
|
||||
'Alpen: oberhalb ca. 2.500 m Höhe — ca. 2–5 % der Schweizer Landesfläche.',
|
||||
'Gespeicherter Kohlenstoff: rund 1.500 Gt — doppelt so viel wie in der Atmosphäre.',
|
||||
'Felssturz Piz Cengalo (CH) 2017: 3 Mio. m³ — ausgelöst durch Permafrost-Auftauen.',
|
||||
],
|
||||
'links' => [
|
||||
['Wikipedia: Permafrost', 'https://de.wikipedia.org/wiki/Permafrost'],
|
||||
['PermaSense (ETH Zürich)', 'https://www.permasense.ch/'],
|
||||
],
|
||||
'related' => ['methan','kipppunkt','klimawandel'],
|
||||
],
|
||||
// ─────────────────────────────────────────────────────────────────────
|
||||
[
|
||||
'key_slug' => 'energiemix',
|
||||
'title' => 'Energiemix',
|
||||
'short' => 'Die Zusammensetzung aller Energiequellen eines Landes — z.B. wie viel Wind, Wasser, Kohle.',
|
||||
'text' => "Der Energiemix zeigt, aus welchen Quellen ein Land seine Energie bezieht — getrennt nach Strom, Wärme und Verkehr. Er ist ein Spiegel dafür, wie klimafreundlich ein Land ist.\nÖsterreichs Strommix ist sehr grün: über 80 % stammen aus erneuerbaren Quellen, vor allem Wasserkraft. Im Verkehr dagegen dominieren noch immer Benzin und Diesel. Beim Heizen nutzen viele Haushalte Erdgas oder Öl.\nFür die Energiewende wird der fossile Anteil im gesamten Mix schrittweise durch Wind, Sonne, Wasser und Biomasse ersetzt — das betrifft auch Wärme (Wärmepumpen) und Verkehr (Elektroautos, Züge).",
|
||||
'unit' => 'Anteil in % pro Energieträger',
|
||||
'category' => 'energie',
|
||||
'image_path' => null,
|
||||
'modules' => ['klima','stadt'],
|
||||
'examples' => [
|
||||
'Österreich Strommix 2023: 60 % Wasserkraft, 12 % Wind, 7 % PV, 10 % Biomasse, 11 % fossil.',
|
||||
'Deutschland Strommix 2023: 31 % Wind, 12 % PV, 9 % Biomasse, 27 % Kohle, 14 % Gas.',
|
||||
'Österreich Gesamtenergie (Strom+Wärme+Verkehr): ca. 38 % erneuerbar (2023).',
|
||||
'Zielbild 2040: Österreich 100 % erneuerbar, Deutschland 80 % Strom aus Erneuerbaren bis 2030.',
|
||||
],
|
||||
'links' => [
|
||||
['E-Control: Strom-Herkunftsnachweise', 'https://www.e-control.at/statistik/strom'],
|
||||
['Statistik Austria: Energie', 'https://www.statistik.at/statistiken/energie-umwelt-innovation/energie'],
|
||||
],
|
||||
'related' => ['erneuerbare-energie','fossile-brennstoffe','photovoltaik','windenergie','wasserkraft'],
|
||||
],
|
||||
// ─────────────────────────────────────────────────────────────────────
|
||||
[
|
||||
'key_slug' => 'kilowattstunde',
|
||||
'title' => 'Kilowattstunde (kWh)',
|
||||
'short' => 'Die Einheit für Energieverbrauch — 1 kW Leistung, eine Stunde lang.',
|
||||
'text' => "Die Kilowattstunde (kWh) ist die Standardeinheit für Energiemenge. Sie zeigt, wie viel Strom verbraucht oder erzeugt wurde: 1 kWh bedeutet, dass ein Gerät mit 1 kW Leistung genau eine Stunde lang gelaufen ist.\nStromrechnungen, Solaranlagen-Erträge und Autobatterien werden in kWh gemessen. Größere Einheiten: 1 MWh = 1.000 kWh, 1 GWh = 1 Million kWh. Eine kWh Strom kostet in Österreich ca. 20–30 Cent (Stand 2024).\nkWh ≠ kW: kW beschreibt die momentane Leistung, kWh den Verbrauch über Zeit. Vergleich: Kilometer pro Stunde (Tempo) vs. Kilometer (zurückgelegte Strecke).",
|
||||
'unit' => 'kWh = 1 kW · 1 h = 3,6 MJ',
|
||||
'category' => 'einheit',
|
||||
'image_path' => 'assets/img/glossar/kwh-vergleich.svg',
|
||||
'modules' => ['klima','stadt'],
|
||||
'examples' => [
|
||||
'Einfamilienhaus Stromverbrauch: ca. 4.000 kWh pro Jahr.',
|
||||
'1 kWh Strom reicht für: 1× Wäsche waschen, ODER 7 h Fernsehen, ODER 7 km E-Auto.',
|
||||
'Vollladung eines Smartphones: 0,015 kWh.',
|
||||
'Ein Tesla Model 3 Akku: 75 kWh — Reichweite ca. 500 km.',
|
||||
'Stromproduktion Österreich: ca. 70 TWh = 70 Mrd. kWh pro Jahr.',
|
||||
],
|
||||
'links' => [
|
||||
['Wikipedia: Kilowattstunde', 'https://de.wikipedia.org/wiki/Kilowattstunde'],
|
||||
],
|
||||
'related' => ['watt','kilowatt','megawatt','photovoltaik'],
|
||||
],
|
||||
];
|
||||
|
||||
// ============ EXECUTE UPSERT ============
|
||||
|
||||
function upsertEntry(PDO $db, array $e): int {
|
||||
$stmt = $db->prepare('SELECT id FROM glossar WHERE key_slug = ?');
|
||||
$stmt->execute([$e['key_slug']]);
|
||||
$id = $stmt->fetchColumn();
|
||||
|
||||
if ($id) {
|
||||
$u = $db->prepare('
|
||||
UPDATE glossar
|
||||
SET title=?, short=?, text=?, unit=?, category=?, image_path=?
|
||||
WHERE id=?
|
||||
');
|
||||
$u->execute([$e['title'], $e['short'], $e['text'], $e['unit'], $e['category'], $e['image_path'], $id]);
|
||||
} else {
|
||||
$u = $db->prepare('
|
||||
INSERT INTO glossar (key_slug, title, short, text, unit, category, image_path)
|
||||
VALUES (?,?,?,?,?,?,?)
|
||||
');
|
||||
$u->execute([$e['key_slug'], $e['title'], $e['short'], $e['text'], $e['unit'], $e['category'], $e['image_path']]);
|
||||
$id = (int) $db->lastInsertId();
|
||||
}
|
||||
|
||||
// Module neu setzen
|
||||
$db->prepare('DELETE FROM glossar_modules WHERE glossar_id=?')->execute([$id]);
|
||||
$im = $db->prepare('INSERT INTO glossar_modules (glossar_id, module_id) VALUES (?,?)');
|
||||
foreach ($e['modules'] as $m) $im->execute([$id, $m]);
|
||||
|
||||
// Examples neu setzen
|
||||
$db->prepare('DELETE FROM glossar_examples WHERE glossar_id=?')->execute([$id]);
|
||||
$ix = $db->prepare('INSERT INTO glossar_examples (glossar_id, text, sort_order) VALUES (?,?,?)');
|
||||
foreach ($e['examples'] as $i => $ex) $ix->execute([$id, $ex, $i]);
|
||||
|
||||
// Links neu setzen
|
||||
$db->prepare('DELETE FROM glossar_links WHERE glossar_id=?')->execute([$id]);
|
||||
$il = $db->prepare('INSERT INTO glossar_links (glossar_id, label, url, sort_order) VALUES (?,?,?,?)');
|
||||
foreach ($e['links'] as $i => $l) $il->execute([$id, $l[0], $l[1], $i]);
|
||||
|
||||
return (int) $id;
|
||||
}
|
||||
|
||||
function linkRelated(PDO $db, int $id, array $relatedSlugs): void {
|
||||
$db->prepare('DELETE FROM glossar_related WHERE glossar_id=?')->execute([$id]);
|
||||
$look = $db->prepare('SELECT id FROM glossar WHERE key_slug=?');
|
||||
$ir = $db->prepare('INSERT INTO glossar_related (glossar_id, related_id) VALUES (?,?)');
|
||||
foreach ($relatedSlugs as $slug) {
|
||||
$look->execute([$slug]);
|
||||
$rid = $look->fetchColumn();
|
||||
if ($rid && (int)$rid !== $id) {
|
||||
$ir->execute([$id, (int)$rid]);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
$ids = [];
|
||||
foreach ($entries as $e) {
|
||||
$ids[$e['key_slug']] = upsertEntry($db, $e);
|
||||
echo sprintf("[%3d] %-22s %s\n", $ids[$e['key_slug']], $e['key_slug'], $e['title']);
|
||||
}
|
||||
|
||||
// Related-Links erst im zweiten Durchlauf, wenn alle IDs existieren
|
||||
foreach ($entries as $e) {
|
||||
linkRelated($db, $ids[$e['key_slug']], $e['related']);
|
||||
}
|
||||
|
||||
echo "\n✓ " . count($entries) . " Einträge upserted.\n";
|
||||
Reference in New Issue
Block a user