a425ce31e6
- 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>
94 lines
5.5 KiB
XML
94 lines
5.5 KiB
XML
<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>
|