From fe12e57d88139721ef7a74a00c2cfe6f449683d6 Mon Sep 17 00:00:00 2001 From: "m0@nas" Date: Wed, 16 Sep 2026 09:43:32 +0200 Subject: [PATCH] Uebersicht: gestauchte Ringskala und staerker gespreizte Flusspunkte Der Ring wuchs linear bis zur Skala - bei 15 kW Vollausschlag war ein Geschoss mit 300 W ein Strich von zwei Grad. Jetzt bekommt das untere Zehntel knapp ein Drittel des Rings, der volle Ausschlag bleibt bei skala. Bei mehreren Segmenten wird ueber die Summe gerechnet, sonst waere die Skala nicht additiv. Die Punkte laufen jetzt von 2,4 bis 13 statt 3,5 bis 10. Co-Authored-By: Claude Opus 5 --- css/solar.css | 2 +- js/solar/energiefluss.js | 32 +++++++++++++++++++++++++++++--- js/solar/energieflussKatalog.js | 4 +++- 3 files changed, 33 insertions(+), 5 deletions(-) diff --git a/css/solar.css b/css/solar.css index 5d39d6e..3338a41 100644 --- a/css/solar.css +++ b/css/solar.css @@ -3614,7 +3614,7 @@ svg.enf.enf-hoch { max-height: none; } /* --- Flüsse -------------------------------------------------------------- */ .enf .enf-bett { fill: none; stroke: #252b31; stroke-linecap: round; - stroke-width: calc(var(--breite, 0) * 1px + 5px); + stroke-width: calc(var(--breite, 0) * .7px + 5px); stroke-dasharray: 1 1; stroke-dashoffset: 1; transition: stroke-width .8s; animation: enf-zeichnen .9s cubic-bezier(.5, 0, .2, 1) forwards; animation-delay: var(--verz); diff --git a/js/solar/energiefluss.js b/js/solar/energiefluss.js index 26c0a5e..cc51620 100644 --- a/js/solar/energiefluss.js +++ b/js/solar/energiefluss.js @@ -30,6 +30,21 @@ "use strict"; const NS = "http://www.w3.org/2000/svg"; + /** + * Wie voll der Ring bei dieser Leistung ist (0..1). + * + * Nicht linear: bei 15 kW Vollausschlag waeren 300 W ein Strich von zwei + * Grad - man saehe nicht, ob das Erdgeschoss 50 W oder 500 W zieht, und + * genau in diesem Bereich steht die Anlage die meiste Zeit. Die gestauchte + * Skala gibt dem unteren Zehntel knapp ein Drittel des Rings und laesst den + * vollen Ausschlag trotzdem genau bei "skala". + */ + function ringAnteil(w, skala) { + if (!(skala > 0)) return 0; + const teil = Math.max(0, Math.min(1, Math.abs(w) / skala)); + return Math.log10(1 + 9 * teil); + } + const RADIUS = 78; const RADIUS_GROSS = 92; const RAND = 60; // Luft um die äußersten Kreise @@ -481,10 +496,18 @@ while (e.segmente.length < segmente.length) { e.segmente.push(el("circle", { r: this.radius(k), class: "enf-bogen", pathLength: "100" }, e.ring)); } - let start = 0; + // Gerechnet wird ueber die Summe, nicht je Segment: die gestauchte + // Skala ist nicht additiv, sonst reichten drei Viertel-Segmente weiter + // als ein volles. + let start = 0, summe = 0; e.segmente.forEach((kreis, i) => { const s = segmente[i]; - let laenge = s ? Math.max(0, Math.min(100 - start, (s.w / skala) * 100)) : 0; + let laenge = 0; + if (s) { + const vorher = ringAnteil(summe, skala) * 100; + summe += Math.max(0, s.w); + laenge = Math.max(0, Math.min(100 - start, ringAnteil(summe, skala) * 100 - vorher)); + } if (laenge < 0.4) laenge = 0; const luecke = laenge > 0 && start > 0 ? 0.6 : 0; const a = (laenge - luecke).toFixed(2), off = (-(start + luecke)).toFixed(2); @@ -561,7 +584,10 @@ flussSetzen(f, w) { const a = Math.abs(w); const still = a < 15; - const breite = still ? 0 : 3.5 + 6.5 * (1 - Math.exp(-a / 3000)); + // Die Punktgroesse soll die Leistung erzaehlen: von 2,4 (ein paar + // hundert Watt) bis 13 (Volllast). Vorher lag alles ab 3 kW dicht + // beieinander. + const breite = still ? 0 : 2.4 + 11 * (1 - Math.exp(-a / 5000)); // Schneller bei mehr Leistung: 2,6 s je Abschnitt bei wenig, 0,7 s bei viel. // Gesetzt wird nicht die Dauer der CSS-Animation - eine neue Dauer // rechnet die Position neu, und die Punkte springen -, sondern ihre diff --git a/js/solar/energieflussKatalog.js b/js/solar/energieflussKatalog.js index aed464e..2b74630 100644 --- a/js/solar/energieflussKatalog.js +++ b/js/solar/energieflussKatalog.js @@ -24,7 +24,9 @@ x, y Mitte in der Queransicht (Zeichenfläche etwa 1400 x 850) hochX, hochY Mitte in der Hochkant-Ansicht, falls das blosse Tauschen von x und y den Kreis dort ungünstig stellt (optional) - skala Leistung in W, bei der der Ring voll ist + skala Leistung in W, bei der der Ring voll ist. Dazwischen ist die + Skala gestaucht (ringAnteil() in energiefluss.js): kleine + Leistungen bekommen mehr Ring als ihr Anteil klick {ansicht: "anlage"} oder {modal: "heater"} - Ziel beim Antippen optionen Vorgabe für die Optionen, die in den Einstellungen änderbar sind zonen nur Bewässerung: die Anzeigen, die solarMQTT.js beschreibt;