Aura – Modernes Dashboard für ioBroker (Beta-Tester gesucht)
-
@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?
NUC i7 64GB mit Proxmox ---- Jarvis Infos Aktualisierungen der Doku auf Instagram verfolgen -> mcuiobroker Instagram
Wenn Euch mein Vorschlag geholfen hat, bitte rechts "^" klicken. -
@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; }NUC i7 64GB mit Proxmox ---- Jarvis Infos Aktualisierungen der Doku auf Instagram verfolgen -> mcuiobroker Instagram
Wenn Euch mein Vorschlag geholfen hat, bitte rechts "^" klicken. -
@flkontakt Und das klappt nicht?
Entweder über das Widget ->
oder CSS ->
.aura-widget-w-1777821996087 div:has(> style + .roomWrap) { height: 100vh !important; }@flkontakt Und das klappt nicht?
Entweder über das Widget ->
oder CSS ->
.aura-widget-w-1777821996087 div:has(> style + .roomWrap) { height: 100vh !important; }Moin @mcu , vielen Dank für deine Rückmeldung, mit dem Eintrag <div style="height:520px">{dp}</div> funktioniert es jetzt. Siehe Bild, links das direkte Ergebnis in Aura mit dessen html-Widget, rechts per iframe aus iob-vis. Jetzt kann ich mir an der Stelle die Brücke nach iob-vis sparen.
Schönes Wochenende!
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 AnmeldenSupport us
468
Online32.9k
Benutzer83.2k
Themen1.3m
Beiträge