Compact Dashboard with an overall view


I need a method to create a compact overall view in a tab.
At the Moment i use templates. But i want to have a status "LED" and so i use the status node for that.
As third i need a kind of progress bar so i used a gauge node.

My problem : all that needs to much space in my overview. i would like to have 24 squares and every one has a led, a progressbar and maybe 5 textlines.

I tried to use the table node for that but:

  1. i cant get my jsondata to an array of objects ( i simply dont know how to do that)
  2. its not very nice

Is there a good way to get my overview ?

I would be happy for a simple example to learn from .


You can change the grid sizing for Dashboard. That may help you make things smaller. The other thing that you can do is play with the CSS to reduce padding/margins. Ultimately, if you really need tight control, you might want to consider whether it would be easier to create something from scratch rather than using the generic Dashboard.

mhmm ok , i will try to play around with the grid size. How do i change the padding/margins per CSS ?

The Grid Size helped a little bit. That will my solution until i find something better.
I hope somebody knows something nice :slight_smile:

The art of squeezing all necessary info into limited size but preserving readability has never been easy task. A lot of compromise decisions and it goes mostly by trial and error, case by case. There is some thumb-rules which are boring to read and hard to follow and at the end of the day, design decisions are yours.
It will be easier for you to do first a little research here in terms of dashboard layout and CSS and stuff like this. There is quite many threads covering those topics from many different points of view. It will save quite of time for you, if you know about the limits in advance.

1 Like

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.