Jahresrückblick 2025 – unser neuer Blogbeitrag ist online! ✨

[Thomas Jansen]

@en1ac Der Post ist zwar schon älter aber ich poste trotzdem mal mein Dashboard...!

[Codierknecht]

@thomas-jansen sagte in Zeigt her eure Dashboards:

@en1ac Der Post ist zwar schon älter aber ich poste trotzdem mal mein Dashboard...!

Sehr stylish ... und dazu noch aus der Nachbarschaft (Neersen) :wave: :blush:

[Thomas Jansen]

@codierknecht ;) Na dann mal LG an die Nachbarschaft....

[topsurfer]

Sorry, wenn ich diesen Thread wiederbelebe,
aber ich habe zum "designen" von Dashboards eine Frage bzw. Fragen, die ich auch nach 3 Monaten mit iobroker mir noch nicht richtig beantworten kann.
Nutze vis-2, Lovelance ist nicht installiert (oder sollte man das auf jedem Fall installieren?).

Oben sind Dashboards, dazu hier meine 3 Fragen (A, B, C):
A) Dieses "Gruppieren" wie macht man das? Ist das ein Widget, oder HTML-Code?
Gibt es keine Option auf einem Dashboard "Linien" zu ziehen um "Unterteilungen" (Gruppen) darzustellen; Werte und Icons etwas zu trennen bzw. zu gruppieren ?

B) Dass ist ja unter Navigation => Anwendungsleiste zu finden,
aber wie kann man dort so ein Übersicht anzeigen? Ich sehe im vis2-Designer nur "Untertitel" und "Icon", aber keine Option, mehrere (anklickbare) Texte bzw. Buttons dort zu hinterlegen.

C) Für die einzelne Titel der Navigation kann man verschiedene Farben festlegen, aber wie geht so ein (blauer) Trennstrich zwischen den einzelnen Titeln?

[Darkmann2000]

@topsurfer

Hi.
ich habe dir meine Vis per We Transfer Hochgeladen. https://we.tl/t-xFl5SCDjjk

Nicht wundern die Alarmview sieht anders aus. bzw. es fehlen Elemente. Habe mich für eine Ajax Alarmsystem entschieden, deswegen nicht mehr über die VIS. Sonst ist aber alles geblieben. Anbei die passenden Widget. Kannst du direkt als Widget impotieren

A)

[{"tpl":"tplVis-materialdesign-Card","data":{"g_fixed":true,"g_visibility":false,"g_css_font_text":false,"g_css_background":false,"g_css_shadow_padding":true,"g_css_border":true,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","titleLayout":"22","subtitleLayout":"","cardLayout":"Basic","cardStyle":"default","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"title":"<center>Meldungen","subtitle":" ","html":"","colorBackground":"#212121","colorTitleSectionBackground":"black","colorTitle":"white","colorSubtitle":"","colorTextSectionBackground":"","labelTextHeight":"","labelSubTextHeight":"20","class":"","showTitle":"true","titleFontFamily":"{vis-materialdesign.0.fonts.card.title}","showSubTitle":"true","subTitleFontFamily":"{vis-materialdesign.0.fonts.card.subTitle}","showText":"true","textFontSize":"{vis-materialdesign.0.fontSizes.card.text}","textFontFamily":"{vis-materialdesign.0.fonts.card.text}","refresh_oid_delay":"100","refresh_animation_duration":"150","colorBody":"{mode:vis-materialdesign.0.colors.darkTheme;light:vis-materialdesign.0.colors.light.card.text;dark:vis-materialdesign.0.colors.dark.card.text; mode === \"true\" ? dark : light}","clickType":"none","controlType":"link","listItemDataMethod":"inputPerEditor","showScrollbar":"true"},"style":{"left":"1034px","top":"166px","width":"317px","height":"450px","z-index":"1","border-radius":"5px","border-width":"2px","border-style":"none","border-color":"#7b7b8a","box-shadow":"0px 0px 20px 5px black"},"widgetSet":"materialdesign"}]

B)

[{"tpl":"tplVis-materialdesign-Button-Navigation-vertical","data":{"g_fixed":true,"g_visibility":false,"g_css_font_text":false,"g_css_background":true,"g_css_shadow_padding":false,"g_css_border":true,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","buttonStyle":"raised","vibrateOnMobilDevices":"50","textFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.button.vertical.text","textFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.button.vertical.text","alignment":"center","mdwButtonPrimaryColor":"#mdwTheme:vis-materialdesign.0.colors.button.vertical.primary","mdwButtonSecondaryColor":"#mdwTheme:vis-materialdesign.0.colors.button.vertical.secondary","iconPosition":"top","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"nav_view":"Auto","buttontext":"Auto","image":"car","iconHeight":"30","distanceBetweenTextAndImage":"8","imageColor":"#f09514","views":["3D_Drucker","Adapter","Alarmanlage","Anwesenheit","Außenbereich","Auto","Badezimmer","Bastelzimmer","Energieverbrauch","Flur","Fritz_Box","Garage","Home","HWR","Kalender","Kinderzimmer","Küche","Programme","Schlafzimmer","Server","Staubsauger","Verkehr","Weihnachten","Wetter","Wohnzimmer"]},"style":{"left":"437px","top":"8px","z-index":"49","background":"#29292e","width":"101px","height":"86px","border-style":"","border-width":"","border-color":"","border-radius":"10px"},"widgetSet":"materialdesign"}]

C)

[{"tpl":"tplHtml","data":{"g_fixed":true,"g_visibility":false,"g_css_font_text":false,"g_css_background":true,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","refreshInterval":"0","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"views":["3D_Drucker","Adapter","Alarmanlage","Anwesenheit","Außenbereich","Auto","Badezimmer","Bastelzimmer","Energieverbrauch","Flur","Fritz_Box","Garage","HWR","Kameras","Kinderzimmer","Küche","Programme","Schlafzimmer","Server","Staubsauger","Verkehr","Weihnachten","Wetter","Wohnzimmer"]},"style":{"left":"11px","top":"419px","width":"190px","height":"5px","background":"blue","z-index":"50"},"widgetSet":"basic"}]