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

[Damian]

Zwei in einem ist gut, drei in einem ist besser

Ich bastle gerade an icon_ring2.

[Damian]

Ich habe jetzt bei allen Ring-Funktionen die Option eingebaut Schrift-Attribute zu verändern. Ich habe die Idee von Sany übernommen und lasse die Nachkommastellen etwas kleiner erscheinen. Ich denke, dass es besser aussieht und nebenbei mehr Platz verschafft.

[xenos1984]

Dann dauert es bei dir noch bis ein Frühlingsgefühl aufkommt - bei uns sind am Wochenende +17°C mit Sonnenschein angesagt, dann werden sich meine Ringe eher gelb verfärben

+17°C ist auf meiner Skala schon fast orange

Was mir gerade noch als Wunsch einfällt wäre ein drehbares Icon oder irgendwas ähnliches um eine Windrose zu realisieren (wenn schon Windgeschwindigkeit angezeigt wird, warum dann nicht auch die Richtung). Falls du dazu eine Idee hast, das geschickt umzusetzen, wäre das super. Vielleicht entweder, indem man ein Icon dreht (also neben scale(...) noch ein rotate(...)), oder als komplett eigenes Widget, das dann statt der Gradzahl die Windrichtung als N oder NW oder WNW anzeigt. (Wenn man eines der _ring Widgets benutzt, kann man N / NW / WNW etc. natürlich als Einheit mit übergeben, und bekäme dann z.B. 45° NE angezeigt - das wäre flexibler als das im Modul fest zu kodieren.)

[Damian]

+17°C ist auf meiner Skala schon fast orange

Was mir gerade noch als Wunsch einfällt wäre ein drehbares Icon oder irgendwas ähnliches um eine Windrose zu realisieren (wenn schon Windgeschwindigkeit angezeigt wird, warum dann nicht auch die Richtung). Falls du dazu eine Idee hast, das geschickt umzusetzen, wäre das super. Vielleicht entweder, indem man ein Icon dreht (also neben scale(...) noch ein rotate(...)), oder als komplett eigenes Widget, das dann statt der Gradzahl die Windrichtung als N oder NW oder WNW anzeigt. (Wenn man eines der _ring Widgets benutzt, kann man N / NW / WNW etc. natürlich als Einheit mit übergeben, und bekäme dann z.B. 45° NE angezeigt - das wäre flexibler als das im Modul fest zu kodieren.)

Es gibt da mehrere Möglichkeiten:

1) Eine Animation kann man in ein Icon einbauen, ein selbst drehendes Etwas habe ich irgendwo bei den Wettericons schon gesehen.

2 Eine bestimmte Drehrichtung eines Icons lässt sich einfach als ein weiterer Parameter beim Icon selbst einbauen:  "icon, scale,x,y,rotation"

3) Unterschiedliche Icons je nach Zustand geht ja jetzt schon mit dem ternären Operator:

icon_ring ([wind:state] eq "NE" ? "icon_NN" : ([wind:state] eq "NW" ? "icon_NW":....

[jkriegl]

Es gibt Windrichtungsicons s. oben #74

Code Auswählen Erweitern

icon_ring ("weather_wind_directions_".[muc:windDirIcon],[muc:windSpeed],0,120,120,0,[muc:windDirText],1,120)
Man bräuchte bessere, nicht nur einen einfachen Pfeil.

[Damian]

Ich habe icon_ring2 noch mal umgebaut, jetzt sieht es aufgeräumter aus. Die Schrift-Attribute der Werte sind jetzt anpassbar:

Code Auswählen Erweitern

"icon_ring2"| icon_ring2("car,1.5,0,-3",[tesla:Strom],0,16,120,0,"A",120,undef,"2,font-weight:normal",[tesla:Kapazitaet],0,100,0,120,"%",undef,"1,font-weight:normal",)|
icon_temp_hum_ring("temp_outside",[Aussensensor:temperature],[Aussensensor:humidity],undef,undef,120)|
icon_temp_temp_ring(([vaillant:Pumpenstatus] eq "on" ? "sani_floor_heating\@Darkorange" : "sani_floor_heating_neutral\@white"),[ESPEasy_ESP_Temp_Vorlauf:Temperature],[ESPEasy_ESP_Temp_Keller_Ruecklauf:Temperature],15,70,120)

[Damian]

Neue Funktionen:

Code Auswählen Erweitern

icon_ring2 ($icon,$val,$min,$max,$minColor,$maxColor,$unit,$size,$func,$decfont1,$val2,$min2,$max2,$minColor2,$maxColor2,$unit2,$func2,$decfont2,$lr,$ln)

icon_temp_hum_ring ($icon,$value,$value2,$min,$max,$size,$lightring,$lightnumber,$decfont1,$decfont2)

icon_temp_temp_ring ($icon,$value,$value2,$min,$max,$size,$lightring,$lightnumber,$decfont1,$decfont2)

Beispiele siehe Post davor.

$decfont1/2 hat den Aufbau:

Code Auswählen Erweitern

<Anzahl der Nachkommastellen>

oder

Code Auswählen Erweitern

<Anzahl der Nachkommastellen>,<font-Attribute>

Beispiel: Eine Nachkommastelle und normale Schrift (nicht fett)

Code Auswählen Erweitern

"1,font-weight:normal"


Bei allen anderen ring-Funktionen entspricht der bisherige Parameter $dec dem Parameter $decfont, dh. neben der Anzahl der Nachkommastellen, lässt sich bei allen Ringen jetzt die Schrift der angezeigten Werte anpassen.

$icon hat jetzt einen weiteren Parameter für Rotation bekommen:

Code Auswählen Erweitern

<iconname>,<scale>,<x>,<y>,<rotate>


Beispiel für Rotation:

Code Auswählen Erweitern


icon_temp_ring("sani_floor_heating_neutral,1,0,0,0",14.8)|
icon_temp_ring("sani_floor_heating_neutral,1,0,0,90",14.8)|
icon_temp_ring("sani_floor_heating_neutral,1,0,0,180",14.8)|
icon_temp_ring("sani_floor_heating_neutral,1,0,0,270",14.8)|
icon_temp_ring("sani_floor_heating_neutral,1,0,0,360",14.8)

[xenos1984]

Ich habe es erst einmal mit diesem Ansatz probiert:

3) Unterschiedliche Icons je nach Zustand geht ja jetzt schon mit dem ternären Operator:

Es gibt Windrichtungsicons s. oben #74

Code Auswählen Erweitern

icon_ring ("weather_wind_directions_".[muc:windDirIcon],[muc:windSpeed],0,120,120,0,[muc:windDirText],1,120)
Man bräuchte bessere, nicht nur einen einfachen Pfeil.

Siehe Bildanhang. Geht vom Prinzip her, aber die Icons könnten wirklich besser sein. Statt eines kleinen Pfeils wäre etwas größeres besser, das mehr Aussagekraft hat - mit einem großen Pfeil ist es besser.

$icon hat jetzt einen weiteren Parameter für Rotation bekommen:

Code Auswählen Erweitern

<iconname>,<scale>,<x>,<y>,<rotate>


Beispiel für Rotation:

Code Auswählen Erweitern


icon_temp_ring("sani_floor_heating_neutral,1,0,0,0",14.8)|
icon_temp_ring("sani_floor_heating_neutral,1,0,0,90",14.8)|
icon_temp_ring("sani_floor_heating_neutral,1,0,0,180",14.8)|
icon_temp_ring("sani_floor_heating_neutral,1,0,0,270",14.8)|
icon_temp_ring("sani_floor_heating_neutral,1,0,0,360",14.8)

Sehr cool!

[Damian]

Habe mal auf die Schnelle ein Icon wind gebastelt:

Bsp.:

Code Auswählen Erweitern

icon_ring("wind\@white,1,0,0,".[wind:richtung],[wind:richtung],0,360)

Die Farben sind nicht gesetzt.

[CQuadrat]

Daran hatte ich gerade gedacht 

Cool wäre es noch, wenn ich bei Windstärke=0 ein anderes Icon wählen könnte; oder auch eine andere Farbe.
Obwohl der Zeiger zwar technisch in eine (willkürliche) Richtung zeigt, kann man da nicht wirklich von einer Windrichtung sprechen.

[Damian]

Daran hatte ich gerade gedacht 

Cool wäre es noch, wenn ich bei Windstärke=0 ein anderes Icon wählen könnte; oder auch eine andere Farbe.
Obwohl der Zeiger zwar technisch in eine (willkürliche) Richtung zeigt, kann man da nicht wirklich von einer Windrichtung sprechen.

Warum willkürliche Richtung? Der Zeiger zeigt auf ein Grad genau die Windrichtung an.

Man könnte auch abhängig von der Richtung als Einheit unten die Richtung N, NE, ... anzeigen

Edit: Statt der Windrichtung kann man natürlich auch zusätzlich die Windstärke anzeigen, was sicherlich noch sinnvoller wäre.

[Damian]

Hier mal eine andere Beispieldefinition:

Code Auswählen Erweitern

icon_ring("wind,1,0,0,".[Wind:Richtung],[Wind:Geschwindigkeit],0,50,120,0,"km/h")

und mit der neuen Funkton icon_ring2

Code Auswählen Erweitern

icon_ring2("wind,1,0,0,".[Wind:Richtung],[Wind:Geschwindigkeit],0,50,120,0,"km/h",undef,undef,1,[Wind:Richtung],361,361,60,60,[Wind:Richtungswert],undef,0)

Der Pfeil zeigt genau die Windrichtung an und hat die Farbe der Geschwindigkeit von grün bis rot.

[CQuadrat]

Warum willkürliche Richtung? Der Zeiger zeigt auf ein Grad genau die Windrichtung an.

War zu spät gestern. Ich unterstellte irrtümlich (ohne genau hinzusehen), dass die Ring die Geschwindigkeit darstellt.
In Kombination Ring=Geschwindigkeit und Symbol=Richtung finde ich schon, dass bei Windgeschwindigkeit=0 der Zeiger "anders" aussehen sollte. Er zeigt ja zwar eine Richtung an, aber es gibt doch gar keinen Wind. Ergo auch keine Windrichtung. Ich habe noch nie gehört: Windstille aus Nordwest. Naja, egal.

Edit: Statt der Windrichtung kann man natürlich auch zusätzlich die Windstärke anzeigen, was sicherlich noch sinnvoller wäre.

Ebend.

Und danke für die ganzen optischen Gestaltungsmöglichkeiten. Peppt alles sehr gut auf.

[Damian]

War zu spät gestern. Ich unterstellte irrtümlich (ohne genau hinzusehen), dass die Ring die Geschwindigkeit darstellt.
In Kombination Ring=Geschwindigkeit und Symbol=Richtung finde ich schon, dass bei Windgeschwindigkeit=0 der Zeiger "anders" aussehen sollte. Er zeigt ja zwar eine Richtung an, aber es gibt doch gar keinen Wind. Ergo auch keine Windrichtung. Ich habe noch nie gehört: Windstille aus Nordwest. Naja, egal.
Ebend.

Und danke für die ganzen optischen Gestaltungsmöglichkeiten. Peppt alles sehr gut auf.

Bei absoluter Windstille kannst du dir ein anderes Symbol einblenden

[Sany]

Hi Damian,

vielen Dank fürs Übernehmen von meinem Vorschlag. Finde auch, dass es besser aussieht und ein wenig die "Nicht-so-Wichtigkeit" der Nachkommastellen darstellt.
Die Windanzeige ist auch klasse, nur der Windpfeil, finde ich, sollte anders herum sein. Eine Wetterfahne zeigt in die Richtung, aus der der Wind kommt, auf Wetterkarten ist eigentlich der Wind so dargestellt, wie er weht (also in Pfeilrichtung). Kann man aber auch bei der Werteübergabe umrechnen.

Viele Grüße