Adminator
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>
140 lines
7.7 KiB
XML
140 lines
7.7 KiB
XML
<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>
|