Default colors and color conditions
In the Colors tab of the widget editor, you are able to define various settings regarding in which colors your widget will be displayed.
The first section you will see when navigating to the Colors tab is Default color. After clicking on it, it will display two fields where you can set a default background color and a default text color for your widget.
Default widget color settings
In this context "default" means, that the default colors will be used, when there are either no color conditions available, or no color conditions are matching. If at least one color condition is matching, the colors defined in the color condition will be used.
With color conditions, you can define what background and text color your widget should use depending on the value of a certain dataset or script.
This can be useful for e.g. giving your widget a red background color if some value is getting critically high/low, or a green background if the value is okay.
Color conditions are available for all widget types.
While color conditions are also available in the overview widget type, they work a bit differently there. For more information please check the documentation for color conditions in overview widgets here.
Here you can define as many color conditions as you need. Each color condition is defined by the following values:
- Datasource type / Datasource / Column: With these settings, you can define which value you want to compare your color condition against. Note that the column select will only display numeric columns from your selected Datasource.
- Text color / Background color: If your condition matches, your selected text color or background color will be applied to your widget.
- Min/max: With these settings, you define the range in which your datasource value needs to be in order for the condition to match. Min/max values can either be fixed values or can be fetched from any dataset or script.
Color conditions only check the first row of a datasource.
As an example, here is an image of a color condition being applied to a text widget:
Matching color condition on a text widget
As long as the value in the Value 1 column of the test-1 dataset is a value between 0 and 50, the background color of the widget will be the selected green and the text color will be the selected black. As soon as the value doesn't match this or any other color conditions, the widget will be displayed in its default state with a white background and black text color.
This example uses fixed values (0 and 50) to specify the limits of the color condition. You can also get your limit values from either a dataset or script, by switching from Fixed to either Dataset or Script in the Condition datasource type setting.
Setting min/max values of a color condition from a script
If multiple color conditions match, it will always be the last one that is getting applied.
Last modified 10mo ago