NEWS
Aura – Modernes Dashboard für ioBroker (Beta-Tester gesucht)
-
@intruder7 schau dir 0.9.126 an
-
@MCU tatsöchlich hatte ich "reine websockets" verwenden aktiv, damit gab es den parameter nicht zu auswahl. hab diesen punkt nun deaktiviert und konnten dann auch websockets erzwingen deaktivieren. danke, jetzt habe ich schon mal eine verbindung. :-)
-
@flkontakt Beispiel JSON-Override
Hallo, vielen Dank für deine Unterstützung, leider stellt sich das gewünschte Ergebnis nicht ein. Siehe Bilder, habe deine Codezeilen in das Widget (Diagramm erweitert) eingetragen, im Backend sieht man auch das passende Ergebnis. Im Frontend werden aber u.a. die Balken und Teile der Beschriftung nicht mehr dargestellt.
Könntest du mal über das Widget schauen, was ich hier eventuell verkehrt gemacht habe? Habe Neustart der Instanz, Strg+F5 im Browser usw. bereits versucht. Vielen Dank!
aura-widget-echart-Hausverbrauch_heute mit JSON.json
aura-widget-echart-Hausverbrauch_heute ohne JSON.json


@flkontakt welche Version von aura?
-
@flkontakt welche Version von aura?
-
@flkontakt welche Version von aura?
Early Adopter, v0.9.127 😉
@flkontakt
Diesen JSON als Override nutzen{ "xAxis": { "axisLabel": { "color": "#ffffff", "fontSize": 12, "fontWeight": "bold" }, "axisLine": { "lineStyle": { "color": "#ffffff" } } }, "yAxis": { "axisLabel": { "color": "#ffffff", "fontSize": 12, "fontWeight": "bold" }, "axisLine": { "lineStyle": { "color": "#ffffff" } }, "splitLine": { "lineStyle": { "color": "rgba(255,255,255,0.15)" } } } } -
@flkontakt
Diesen JSON als Override nutzen{ "xAxis": { "axisLabel": { "color": "#ffffff", "fontSize": 12, "fontWeight": "bold" }, "axisLine": { "lineStyle": { "color": "#ffffff" } } }, "yAxis": { "axisLabel": { "color": "#ffffff", "fontSize": 12, "fontWeight": "bold" }, "axisLine": { "lineStyle": { "color": "#ffffff" } }, "splitLine": { "lineStyle": { "color": "rgba(255,255,255,0.15)" } } } }Man kann den Konverter jarvis2aura jetzt testen.
https://mcuiobroker.gitbook.io/iobroker-tipps/tipps/aura-visualisierung/jarvis2aura -
@flkontakt
Diesen JSON als Override nutzen{ "xAxis": { "axisLabel": { "color": "#ffffff", "fontSize": 12, "fontWeight": "bold" }, "axisLine": { "lineStyle": { "color": "#ffffff" } } }, "yAxis": { "axisLabel": { "color": "#ffffff", "fontSize": 12, "fontWeight": "bold" }, "axisLine": { "lineStyle": { "color": "#ffffff" } }, "splitLine": { "lineStyle": { "color": "rgba(255,255,255,0.15)" } } } }@flkontakt
Diesen JSON als Override nutzenMega, vielen Dank, sieht für mich gut aus. Wenn jetzt noch die Schrift der Werte über den Balken anpassbar wären, würde es auch auf dem Handy usw. besser erkennbar sein.
Sofern es noch kein Issue hierzu gibt, würde ich hierzu eins anlegen (grundsätzlich mehr Möglichkeiten, Beschriftungen anpassbar zu machen).

-
@flkontakt
Diesen JSON als Override nutzenMega, vielen Dank, sieht für mich gut aus. Wenn jetzt noch die Schrift der Werte über den Balken anpassbar wären, würde es auch auf dem Handy usw. besser erkennbar sein.
Sofern es noch kein Issue hierzu gibt, würde ich hierzu eins anlegen (grundsätzlich mehr Möglichkeiten, Beschriftungen anpassbar zu machen).

@flkontakt Versuch mal dies.
{ "textStyle": { "color": "#ffffff", "fontWeight": "bold" }, "xAxis": { "axisLabel": { "color": "#ffffff", "fontSize": 12, "fontWeight": "bold" }, "axisLine": { "lineStyle": { "color": "#ffffff" } } }, "yAxis": { "axisLabel": { "color": "#ffffff", "fontSize": 12, "fontWeight": "bold" }, "axisLine": { "lineStyle": { "color": "#ffffff" } }, "splitLine": { "lineStyle": { "color": "rgba(255,255,255,0.15)" } } } } -
@flkontakt Versuch mal dies.
{ "textStyle": { "color": "#ffffff", "fontWeight": "bold" }, "xAxis": { "axisLabel": { "color": "#ffffff", "fontSize": 12, "fontWeight": "bold" }, "axisLine": { "lineStyle": { "color": "#ffffff" } } }, "yAxis": { "axisLabel": { "color": "#ffffff", "fontSize": 12, "fontWeight": "bold" }, "axisLine": { "lineStyle": { "color": "#ffffff" } }, "splitLine": { "lineStyle": { "color": "rgba(255,255,255,0.15)" } } } } -
@flkontakt Versuch mal dies.
Balkenwert leider unverändert, ist aber kein Problem, grab dich da bitte nicht zu tief ein. Mit den Achsenwerten usw. hast du mir schon enorm geholfen. Vielen Dank!
@flkontakt Hiermit sollte es gehen
{ "textStyle": { "color": "#ffffff", "fontWeight": "bold" }, "xAxis": { "axisLabel": { "color": "#ffffff", "fontSize": 12, "fontWeight": "bold" }, "axisLine": { "lineStyle": { "color": "#ffffff" } } }, "yAxis": { "axisLabel": { "color": "#ffffff", "fontSize": 12, "fontWeight": "bold" }, "axisLine": { "lineStyle": { "color": "#ffffff" } }, "splitLine": { "lineStyle": { "color": "rgba(255,255,255,0.15)" } } }, "series": { "label": { "show": true, "position": "top", "color": "#ffffff", "fontSize": 12, "fontWeight": 900 } } } -
@flkontakt Hiermit sollte es gehen
{ "textStyle": { "color": "#ffffff", "fontWeight": "bold" }, "xAxis": { "axisLabel": { "color": "#ffffff", "fontSize": 12, "fontWeight": "bold" }, "axisLine": { "lineStyle": { "color": "#ffffff" } } }, "yAxis": { "axisLabel": { "color": "#ffffff", "fontSize": 12, "fontWeight": "bold" }, "axisLine": { "lineStyle": { "color": "#ffffff" } }, "splitLine": { "lineStyle": { "color": "rgba(255,255,255,0.15)" } } }, "series": { "label": { "show": true, "position": "top", "color": "#ffffff", "fontSize": 12, "fontWeight": 900 } } }Konvertierung Jarvis -> Aura in eigenem Thread.
https://forum.iobroker.net/topic/84636/konvertierung-jarvis-aura -
@flkontakt Hiermit sollte es gehen
{ "textStyle": { "color": "#ffffff", "fontWeight": "bold" }, "xAxis": { "axisLabel": { "color": "#ffffff", "fontSize": 12, "fontWeight": "bold" }, "axisLine": { "lineStyle": { "color": "#ffffff" } } }, "yAxis": { "axisLabel": { "color": "#ffffff", "fontSize": 12, "fontWeight": "bold" }, "axisLine": { "lineStyle": { "color": "#ffffff" } }, "splitLine": { "lineStyle": { "color": "rgba(255,255,255,0.15)" } } }, "series": { "label": { "show": true, "position": "top", "color": "#ffffff", "fontSize": 12, "fontWeight": 900 } } }@flkontakt Hiermit sollte es gehen
Hallo @mcu , sorry für die späte Rückmeldung. Siehe Bilder, im Backend ist der gewünschte Effekt zu sehen, im Frontend werden die Balken dann aber nicht mehr angezeigt. Habe es mit Strg+F5 usw. versucht, auch habe ich in den CSS&JS den Eintrag rausgenommen, Balken werden dennoch nicht angezeigt. Bin ratlos. Aber nochmal der Hinweis, ist für mich kein Problem, die Werte oberhalb des Balken wären nur das Sahnehäubchen ;-).
Vielen Dank für deinen Support!



-
Hast du auf deiner roadmap evtl auch die Möglichkeit weitere 3rd-party widgets bereit stellen zu können, ohne das sie bei dir im repository sind?
evtl könnte ich dann ein paar meiner widgets für aura adaptieren und bspw über einen zusätzlich installierbaren adapter ala
ioBroker.aura-widgets-rssfeed
bereitzustellen, genau wie bspw
https://github.com/oweitman/ioBroker.vis-2-widgets-rssfeed
(das nur Beispielhaft) -
Hast du auf deiner roadmap evtl auch die Möglichkeit weitere 3rd-party widgets bereit stellen zu können, ohne das sie bei dir im repository sind?
evtl könnte ich dann ein paar meiner widgets für aura adaptieren und bspw über einen zusätzlich installierbaren adapter ala
ioBroker.aura-widgets-rssfeed
bereitzustellen, genau wie bspw
https://github.com/oweitman/ioBroker.vis-2-widgets-rssfeed
(das nur Beispielhaft) -
Hi, ist es irgendwie möglich, z.B. mit den Schnellzugriff-Chips Widget auf ein Tab zu verlinken. So das bei Klick das gewünschte Tab geöffnet wird?
-
@dering , siehe Screenshot und Link https://www.erforscht.com/forum/index.php?thread/328-zigbee-radar-raum-tracking-bewegungsmelder-esp32-c6-hlk-ld2450/&postID=1999&highlight=ld2450#post1999
Kann man das htmlWidget direkt in Aura einbinden?

-
@dering , siehe Screenshot und Link https://www.erforscht.com/forum/index.php?thread/328-zigbee-radar-raum-tracking-bewegungsmelder-esp32-c6-hlk-ld2450/&postID=1999&highlight=ld2450#post1999
Kann man das htmlWidget direkt in Aura einbinden?

@flkontakt Wo ist denn Dein DP?

-
@flkontakt Wo ist denn Dein DP?

@flkontakt Wo ist denn Dein DP?

javascript.0.Raum-Wohnzimmer.widgetHtml
<style> .roomWrap{position:relative;width:100%;height:100%;border:2px solid #000;background:#eee;overflow:hidden} .dot{position:absolute;width:16px;height:16px;border-radius:50%;transform:translate(-50%,-50%)} .zone{position:absolute;pointer-events:none;border:2px dashed;opacity:.15} .zone span{position:absolute;left:2px;top:2px;font-size:12px;color:#000} </style> <div class="roomWrap"><div class="dot" style="background:red;left:71.5%;top:87.4%"></div><div class="dot" style="background:blue;left:-100%;top:-100%"></div><div class="dot" style="background:green;left:-100%;top:-100%"></div><div class="zone" style="border-color:brown;background:brown; left:0.0%;top:51.9%;width:71.7%;height:46.2%"><span>Couch</span></div><div class="zone" style="border-color:green;background:green; left:0.0%;top:11.5%;width:113.0%;height:40.4%"><span>Couch bis Fernseher</span></div><div class="zone" style="border-color:black;background:black; left:28.3%;top:0.0%;width:80.4%;height:11.5%"><span>Schrank</span></div></div> -
@flkontakt Wo ist denn Dein DP?

javascript.0.Raum-Wohnzimmer.widgetHtml
<style> .roomWrap{position:relative;width:100%;height:100%;border:2px solid #000;background:#eee;overflow:hidden} .dot{position:absolute;width:16px;height:16px;border-radius:50%;transform:translate(-50%,-50%)} .zone{position:absolute;pointer-events:none;border:2px dashed;opacity:.15} .zone span{position:absolute;left:2px;top:2px;font-size:12px;color:#000} </style> <div class="roomWrap"><div class="dot" style="background:red;left:71.5%;top:87.4%"></div><div class="dot" style="background:blue;left:-100%;top:-100%"></div><div class="dot" style="background:green;left:-100%;top:-100%"></div><div class="zone" style="border-color:brown;background:brown; left:0.0%;top:51.9%;width:71.7%;height:46.2%"><span>Couch</span></div><div class="zone" style="border-color:green;background:green; left:0.0%;top:11.5%;width:113.0%;height:40.4%"><span>Couch bis Fernseher</span></div><div class="zone" style="border-color:black;background:black; left:28.3%;top:0.0%;width:80.4%;height:11.5%"><span>Schrank</span></div></div>@flkontakt Und das klappt nicht?
Entweder über das Widget ->

oder CSS ->
.aura-widget-w-1777821996087 div:has(> style + .roomWrap) { height: 100vh !important; }
Hey! Du scheinst an dieser Unterhaltung interessiert zu sein, hast aber noch kein Konto.
Hast du es satt, bei jedem Besuch durch die gleichen Beiträge zu scrollen? Wenn du dich für ein Konto anmeldest, kommst du immer genau dorthin zurück, wo du zuvor warst, und kannst dich über neue Antworten benachrichtigen lassen (entweder per E-Mail oder Push-Benachrichtigung). Du kannst auch Lesezeichen speichern und Beiträge positiv bewerten, um anderen Community-Mitgliedern deine Wertschätzung zu zeigen.
Mit deinem Input könnte dieser Beitrag noch besser werden 💗
Registrieren Anmelden

