Caution
This is the documentation for the current development branch of the CometVisu. It is possible that some of the described features are not yet available in the current release.
Also there might be lots of errors in this documentation as some parts of the content have been translated by an online translation service.
Styling
Hint
The functionality of the stylings in the Tile structure does not differ from the stylings in the Pure structure.
Only the name of the element in the configuration file is different: <cv-styling>
.
With the styling tag, colors can be assigned to elements at respective values.
For example, OFF can be displayed in red and ON in green (or vice versa).
Here is a list of possible colors that are included by default in the CometVisu:
grey | |
---|---|
cyan | |
green | |
lime | |
red | |
blue | |
fuchsia | |
black | |
maroon | |
olive | |
purple | |
silver | |
white | |
yellow |
Caution
The colors can vary depending on the design.
With this styling, 0 (often OFF) is displayed in green and 1 (often ON) in red.
<cv-styling name="GreenRed">
<entry value="0">green</entry>
<entry value="1">red</entry>
</cv-styling>
To show an element with the opposite colors, the following style tag must be created. Now the element is red when the value is 0.
<cv-styling name="Red_Green">
<entry value="0">red</entry>
<entry value="1">green</entry>
</cv-styling>
The styling tag can also be used for sliders. Here the value for the range in which the color is displayed is defined. In the following example as follows:
from -100 to 0: blue
the value 0: purple
values > 0: red
<cv-styling name="BluePurpleRed">
<entry range-min="-100" range-max="0">blue</entry>
<entry value="0">purple</entry>
<entry range-min="0" range-max="100">red</entry>
</cv-styling>
Important
How the colors are actually displayed in the design depends on the definition in the CSS for the respective design.
The colors can also be specified in the HTML code. For example: #F33333