neue svg-Funktionen: icon_ring, icon_bar, cylinder_bars, icon_ring2

Begonnen von Damian, 30 Januar 2021, 20:03:18

Vorheriges Thema - Nächstes Thema

Damian

Muss ich schauen, wo ich die Option geschickt unterbringe.
Programmierte FHEM-Module: DOIF-FHEM, DOIF-Perl, DOIF-uiTable, THRESHOLD, FHEM-Befehl: IF

Sany

Hi Damian,

das sieht schon sehr schick aus. Die Schrift für den Wert evtl. anpassbar machen (wie bei Ring2). Ansonsten freue ich mich auf die Ergebnisse!

Gruß
fhem als LXC auf Proxmox auf einem minix Z100 , weitere LXC mit ZigBee2MQTT, MariaDB und Grafana. Homematic, FS20, mySensors, MQTT2, Tasmota, Shelly, Z-Wave  ....

Damian

Zitat von: Sany am 22 März 2021, 13:32:07
Hi Damian,

das sieht schon sehr schick aus. Die Schrift für den Wert evtl. anpassbar machen (wie bei Ring2). Ansonsten freue ich mich auf die Ergebnisse!

Gruß

Die Schrift für Zahl und Einheit ist schon länger anpassbar, wie bei ring2, ist auch im Wiki dokumentiert.

Man wird bei allen ring-Funktionen den Hauptring als "Zeiger" einstellen können.

Die Beschriftung für Min/Max kann ich auch einblenden, allerdings wird es bei größeren Zahlen problematisch sein da unten noch Platz zu finden.
Programmierte FHEM-Module: DOIF-FHEM, DOIF-Perl, DOIF-uiTable, THRESHOLD, FHEM-Befehl: IF

cwagner

Da freu' ich mich auf die neuen Möglichkeiten und präsentiere hier dann mal die Zusammenschau aus 2 Ringe mit Farbsegmentierung und einem wechselnden Icon: Eine Variante der CO2-Ampel. Das Icon für das Symbol ist das finder.svg, das ich für die bad-Variante etwas angepasst habe.

Christian
PI 2B+/5 Raspbian 12, Perl 5.36.0, FHEM 6.3: 295 Module in ConfigDB: Steuerung Heizkessel, FBH, Solarthermie, kontr. Lüftung mit WRG. Smarthome u.a. HMCUL, 1-Wire (FT232RL ; DS2480B), EnOcean (TCM EPS3), MQTT2. DOIF, PID20, Threshold, OWX; Micropelt IRTV, Volkszähler, SolarForecast; MariaDB

Damian

Programmierte FHEM-Module: DOIF-FHEM, DOIF-Perl, DOIF-uiTable, THRESHOLD, FHEM-Befehl: IF

Robothaler

WOW!

Das entwickelt sich ja sehr rasant!

Ich finde den kleinen Strich zur Wertedarstellung auch ganz gut.

Damian

Neue Version eingecheckt.

Ich habe bei der ring-Funktion, auf der alle anderen ring-Funktionen aufbauen, den Parameter $mode erweitert:

$mode hat jetzt folgenden Aufbau "<monochrom>,<minMax>,<innerRing>,<pointer>"

<pointer> is die Dicke des Zeigers, bei anderen Parametern 1 als Flag setzen

Alle Parameter sind kombinierbar.

Die neue universelle icon_uring-Funktion hat folgende Parameterliste:

icon_uring ($mode,$icon,$val,$min,$max,$minColor,$maxColor,$unit,$decfont,$size,$func,$lr,$ln)

Ohne Berücksichtigung der Zeigerdicke ergeben sich damit bereits 16 verschiedene Kombinationen der Darstellung, mit linear bzw. mit eigener Farbfunktion sind es dann schon 32 Kombinationen :)

defmod di_pool DOIF ##
attr di_pool uiTable { package ui_Table}\
## abschnittsweise definierte Farbgebung\
icon_uring("0,1","weather_barometric_pressure",1.2,0,3,undef,undef,"bar",1,100,[(0.8,0,1,60,1.5,120,1.7,60,3,0)])|\
icon_uring("1,1","weather_barometric_pressure",1.2,0,3,undef,undef,"bar",1,100,[(0.8,0,1,60,1.5,120,1.7,60,3,0)])|\
icon_uring("0,1,1,4","weather_barometric_pressure",1.2,0,3,undef,undef,"bar",1,100,[(0.8,0,1,60,1.5,120,1.7,60,3,0)])|\
icon_uring("0,1,1","weather_barometric_pressure",1.2,0,3,undef,undef,"bar",1,100,[(0.8,0,1,60,1.5,120,1.7,60,3,0)])\
##linearer Farbverlauf\
icon_uring("0,0,1,4","weather_barometric_pressure",1.2,0,3,0,120,"bar")|\
icon_uring("0,1,1,4","weather_barometric_pressure",1.2,0,3,0,120,"bar")|\
icon_uring("0,1,1","weather_barometric_pressure",1.2,0,3,0,120,"bar")|\
icon_uring("0,1,0,4","weather_barometric_pressure",1.2,0,3,0,120,"bar")


Edit: Funktionen vereinheitlicht, neue Version eingecheckt, die vorherige eingecheckte Zwischenversion verliert ihre Bedeutung
Programmierte FHEM-Module: DOIF-FHEM, DOIF-Perl, DOIF-uiTable, THRESHOLD, FHEM-Befehl: IF

Sany

Moin,

sehr schön gelöst. Respekt!
Ich habe mal eine Version getestet. Das klappt super.
Ich bin mir immer noch nicht ganz sicher mit den Farben für die Unit und die Skalenwerte. Ich denke, das ist mir ein bissl zu bunt. Ich sehe das so auf einer Oberfläche: die Farbe ist erst mal der "Exe-catcher". In meinem Beispiel mit rot, gelb, grün (was für viele Anzeigen wohl gehen könnte) sieht man, selbst ohne Brille, allein durch das grüne Icon schon den Bereich, wo der Wert ist, also alles im grünen Bereich. Genauso natürlich bei Werten in anderen Bereichen. Bei genauerer Betrachtung lese ich dann die Zahl für den absoluten Wert, der Blick auf den Zeiger ergibt mir den relativen Wert zu min/max. Bei dieser Betrachtung lenken mir die roten Skalenwerte aber zu sehr von der Eigentlichen Information ab. Die würde ich neutral halten. Bei der Unit ist es nicht ganz so wild, da die ja direkt beim Wert steht, finde es sieht aber besser aus, wenn sie nicht eingefärbt ist. Bleibt das Problem, welche Farbe oder wie konfigurierbar. Ich habe en dunkles Design, da passt ein helles grau halt gut, das würde man aber bei einem hellen Design nicht erkennen.

Gruß
fhem als LXC auf Proxmox auf einem minix Z100 , weitere LXC mit ZigBee2MQTT, MariaDB und Grafana. Homematic, FS20, mySensors, MQTT2, Tasmota, Shelly, Z-Wave  ....

Damian

Zitat von: Sany am 23 März 2021, 10:33:54
Moin,

sehr schön gelöst. Respekt!
Ich habe mal eine Version getestet. Das klappt super.
Ich bin mir immer noch nicht ganz sicher mit den Farben für die Unit und die Skalenwerte. Ich denke, das ist mir ein bissl zu bunt. Ich sehe das so auf einer Oberfläche: die Farbe ist erst mal der "Exe-catcher". In meinem Beispiel mit rot, gelb, grün (was für viele Anzeigen wohl gehen könnte) sieht man, selbst ohne Brille, allein durch das grüne Icon schon den Bereich, wo der Wert ist, also alles im grünen Bereich. Genauso natürlich bei Werten in anderen Bereichen. Bei genauerer Betrachtung lese ich dann die Zahl für den absoluten Wert, der Blick auf den Zeiger ergibt mir den relativen Wert zu min/max. Bei dieser Betrachtung lenken mir die roten Skalenwerte aber zu sehr von der Eigentlichen Information ab. Die würde ich neutral halten. Bei der Unit ist es nicht ganz so wild, da die ja direkt beim Wert steht, finde es sieht aber besser aus, wenn sie nicht eingefärbt ist. Bleibt das Problem, welche Farbe oder wie konfigurierbar. Ich habe en dunkles Design, da passt ein helles grau halt gut, das würde man aber bei einem hellen Design nicht erkennen.

Gruß
Das kriegen wir auch noch konfigurierbar hin, denn es gibt Konstellationen, da könnte die Farbe eine gewisse Aussagekraft haben.
Programmierte FHEM-Module: DOIF-FHEM, DOIF-Perl, DOIF-uiTable, THRESHOLD, FHEM-Befehl: IF

Sany

ZitatDas kriegen wir auch noch konfigurierbar hin
da bin ich mir aber sowas von sicher  ;) ;)

Zitat, denn es gibt Konstellationen, da könnte die Farbe eine gewisse Aussagekraft haben.
das stimmt.

Ich habe mal noch die Skalenwerte etwas weiter auseinander dargestellt, passt gut und sieht nicht so gedrängelt aus bei der Unit.
(nur per Bildbearbeitung gemacht!)

Ich hoffe, das alles kommt jetzt nicht "kleinlich" rüber, soll nur als Input dienen.

Auch mal wieder (kann man nicht genug wiederholen):

Vielen Dank für die tollen Funktionen!!
Bin dann auf Ostern gespannt!

Gruß

Sany
fhem als LXC auf Proxmox auf einem minix Z100 , weitere LXC mit ZigBee2MQTT, MariaDB und Grafana. Homematic, FS20, mySensors, MQTT2, Tasmota, Shelly, Z-Wave  ....

Damian

Schon fertig. Man kann jetzt beim Parameter minMax nicht nur 0, 1 angeben, sondern beliebige SVG-Attribute. Damit kann man so ziemlich alles ändern.

icon_uring("0,fill:white,1,4","weather_barometric_pressure",1.2,0,3,undef,undef,"bar",1,100,[(0.8,0,1,60,1.5,120,1.7,60,3,0)])
Programmierte FHEM-Module: DOIF-FHEM, DOIF-Perl, DOIF-uiTable, THRESHOLD, FHEM-Befehl: IF

Sany

Hammer,
du baust das schneller ein als ich das ausprobieren kann..... ;) ;) :D

Für Icon, Wert und Unit kann man ja jetzt schon die Farben individuell anpassen. Damit habe ich jetzt keine offenen Wünsche mehr.
fhem als LXC auf Proxmox auf einem minix Z100 , weitere LXC mit ZigBee2MQTT, MariaDB und Grafana. Homematic, FS20, mySensors, MQTT2, Tasmota, Shelly, Z-Wave  ....

Damian

Neue Version eingecheckt. Ich habe auch Min/Max etwas auseinander gezogen, aber nicht zu viel, denn es müssen auch größere Angaben passen. Man kann natürlich auch die lightness-Parameter für alle Angaben verwenden.

https://svn.fhem.de/trac/browser/trunk/fhem/FHEM?order=date&desc=1
Programmierte FHEM-Module: DOIF-FHEM, DOIF-Perl, DOIF-uiTable, THRESHOLD, FHEM-Befehl: IF

Damian

Programmierte FHEM-Module: DOIF-FHEM, DOIF-Perl, DOIF-uiTable, THRESHOLD, FHEM-Befehl: IF

Damian

Programmierte FHEM-Module: DOIF-FHEM, DOIF-Perl, DOIF-uiTable, THRESHOLD, FHEM-Befehl: IF