diff --git a/App/assets/js/glossar-experiments.js b/App/assets/js/glossar-experiments.js index 7d7e852..50962b6 100644 --- a/App/assets/js/glossar-experiments.js +++ b/App/assets/js/glossar-experiments.js @@ -445,118 +445,6 @@ update(); } - // ===================================================================== - // Experiment: Windrad-Höhenslider — Höhe ändern, Vergleichsobjekte leuchten - // ===================================================================== - function windradSlider(root) { - const objects = [ - { label: 'Mensch', h: 1.8, color: '#1f4e5a' }, - { label: 'Einfamilienhaus', h: 8, color: '#c85c4a' }, - { label: 'Alter Baum', h: 25, color: '#5a8a5e' }, - { label: 'Kirchturm', h: 60, color: '#c4a97a' }, - { label: 'Altes Windrad', h: 100, color: '#8a8a8a' }, - { label: 'DC Tower Wien', h: 220, color: '#4a7c8a' }, - { label: 'Modernes Windrad',h: 240, color: '#3a6b3e' } - ]; - root.innerHTML = ` -
-
-

🌬 Wie groß ist ein modernes Windrad?

-

Schiebe den Regler auf die vermutete Höhe. Das passende Objekt leuchtet auf — ab 240 m bist du auf Höhe des modernen Windrads.

-
- -
- - -
-
-
In dieser Höhenklasse: Altes Windrad
-
-

Moderne Windräder in Österreich: Nabe 100–160 m, Rotor bis 80 m Länge, Gesamthöhe bis 240 m. Quelle: IG Windkraft Österreich.

-
- `; - const svg = root.querySelector('.ge-wind-svg'); - const rng = root.querySelector('#ge-wind-range'); - const mOut = root.querySelector('#ge-wind-m'); - const matchOut = root.querySelector('#ge-wind-match'); - - // Ground - svgEl('rect', { x: 0, y: 320, width: 600, height: 40, fill: '#5a8a5e' }, svg); - // SKALA: 1 m = 1.2 px, Boden y=320, top bei 240 m = 320 - 240*1.2 = 32 - const mToY = m => 320 - m * 1.2; - - // Objekte als Silhouetten, jedes an fester x-Position - const objG = objects.map((o, i) => { - const g = svgEl('g', { class: 'ge-wind-obj' }, svg); - const x = 80 + i * 72; - // Silhouette: einfaches Rechteck oder Dreieck (stilisiert) - const y = mToY(o.h); - const h = 320 - y; - if (o.label.includes('Baum')) { - svgEl('ellipse', { cx: x, cy: y + 10, rx: 14, ry: 18, fill: o.color }, g); - svgEl('rect', { x: x - 2, y: y + 25, width: 4, height: h - 25, fill: '#6b4a2e' }, g); - } else if (o.label.includes('Mensch')) { - svgEl('circle', { cx: x, cy: y + 2, r: 1.4, fill: o.color }, g); - svgEl('rect', { x: x - 0.5, y: y + 2, width: 1, height: 2, fill: o.color }, g); - } else if (o.label.includes('Haus')) { - svgEl('rect', { x: x - 12, y: y + 4, width: 24, height: h - 4, fill: '#e8d5b5', stroke: '#1f4e5a', 'stroke-width': '0.6' }, g); - svgEl('polygon', { points: `${x-14},${y+4} ${x},${y-4} ${x+14},${y+4}`, fill: o.color }, g); - } else if (o.label.includes('Kirchturm')) { - svgEl('rect', { x: x - 8, y: y + 12, width: 16, height: h - 12, fill: o.color, stroke: '#1f4e5a', 'stroke-width': '0.6' }, g); - svgEl('polygon', { points: `${x-10},${y+12} ${x},${y} ${x+10},${y+12}`, fill: '#c85c4a' }, g); - } else if (o.label.includes('Tower')) { - svgEl('rect', { x: x - 7, y, width: 14, height: h, fill: o.color, stroke: '#1f4e5a', 'stroke-width': '0.6' }, g); - // Window stripes - for (let k = 0; k < 8; k++) { - svgEl('rect', { x: x - 5, y: y + 8 + k * (h / 10), width: 10, height: 2, fill: '#e8d5b5', opacity: '0.7' }, g); - } - } else if (o.label === 'Altes Windrad') { - svgEl('rect', { x: x - 1.5, y, width: 3, height: h, fill: o.color }, g); - svgEl('circle', { cx: x, cy: y, r: 2.2, fill: '#1f4e5a' }, g); - svgEl('line', { x1: x, y1: y, x2: x, y2: y - 22, stroke: '#1f4e5a', 'stroke-width': '1.6', 'stroke-linecap': 'round' }, g); - svgEl('line', { x1: x, y1: y, x2: x + 18, y2: y + 12, stroke: '#1f4e5a', 'stroke-width': '1.6', 'stroke-linecap': 'round' }, g); - svgEl('line', { x1: x, y1: y, x2: x - 18, y2: y + 12, stroke: '#1f4e5a', 'stroke-width': '1.6', 'stroke-linecap': 'round' }, g); - } else if (o.label === 'Modernes Windrad') { - svgEl('polygon', { points: `${x-3},320 ${x+3},320 ${x+2},${y+8} ${x-2},${y+8}`, fill: '#fff', stroke: '#1f4e5a', 'stroke-width': '0.8' }, g); - svgEl('rect', { x: x - 4, y: y + 4, width: 8, height: 6, fill: '#1f4e5a' }, g); - svgEl('circle', { cx: x, cy: y + 8, r: 3, fill: o.color }, g); - // Rotor - svgEl('line', { x1: x, y1: y + 8, x2: x, y2: y - 72, stroke: '#1f4e5a', 'stroke-width': '2', 'stroke-linecap': 'round' }, g); - svgEl('line', { x1: x, y1: y + 8, x2: x + 62, y2: y + 44, stroke: '#1f4e5a', 'stroke-width': '2', 'stroke-linecap': 'round' }, g); - svgEl('line', { x1: x, y1: y + 8, x2: x - 62, y2: y + 44, stroke: '#1f4e5a', 'stroke-width': '2', 'stroke-linecap': 'round' }, g); - } - // Label unter dem Objekt - const lbl = svgEl('text', { x, y: 340, 'text-anchor': 'middle', 'font-size': '8', fill: '#4a4a4a', 'font-weight': '600' }, g); - lbl.textContent = o.h < 10 ? o.h.toFixed(1).replace('.', ',') + ' m' : o.h + ' m'; - return { g, o }; - }); - - // Markierungslinie (aktuelle Höhe) - const markerLine = svgEl('line', { x1: 30, y1: 200, x2: 570, y2: 200, stroke: '#c85c4a', 'stroke-width': '1.5', 'stroke-dasharray': '4 3' }, svg); - const markerLabel = svgEl('text', { x: 34, y: 196, 'font-size': '10', fill: '#c85c4a', 'font-weight': '700' }, svg); - - function update() { - const m = +rng.value; - mOut.textContent = m; - const y = mToY(m); - markerLine.setAttribute('y1', y); - markerLine.setAttribute('y2', y); - markerLabel.setAttribute('y', y - 4); - markerLabel.textContent = m + ' m'; - // Aktives Objekt finden: Höhe ≤ m und max - let bestIdx = -1; - objects.forEach((o, i) => { - if (o.h <= m + 5 && (bestIdx === -1 || o.h > objects[bestIdx].h)) bestIdx = i; - }); - objG.forEach((ob, i) => { - ob.g.classList.toggle('ge-wind-active', i === bestIdx); - }); - matchOut.textContent = bestIdx >= 0 ? objects[bestIdx].label : '(noch nichts)'; - } - rng.addEventListener('input', update); - update(); - } - // ===================================================================== // Experiment: Methan-GWP-Waage — 1 kg Methan gegen wie viel CO₂? // ===================================================================== @@ -653,7 +541,7 @@ 'albedo': albedoSlider, 'co2-fussabdruck': footprintCalc, 'treibhauseffekt': greenhouseSlider, - 'windenergie': windradSlider, 'methan': methaneBalance + // 'windenergie' bewusst raus — redundant mit windrad-groessenvergleich.svg }; })();