The Image widget¶
Description¶
Adds an image to your visualization. Using the auto-refresh setting this widget can be used e.g. to show a camera picture.
Settings¶
For a general understanding of how the configuration files are structured and what elements and attributes are it is recommended to read this section first: visu-config-details.
The behaviour and appearance of the Image widget can be influenced by using certain attributes and elements. The following tables show the allowed attributes and elements and their possible values. The screenshots show, how both can be edited in the editor.
Attributes underlined by ..... are mandatory, all the others are optional and be omitted.
Allowed attributes in the Image-element¶
Element | Attribute | |||
---|---|---|---|---|
Name | Content | Description | ||
image | src | URI | Complete path (URI) to the picture | |
width | dimenstion (number+unit) | Sets the width of the image. Format must be CSS (e.g. px, em, %). | ||
height | dimenstion (number+unit) | Sets the height of the image. Format must be CSS (e.g. px, em, %). | ||
widthfit | true or false | |||
refresh | decimal | Sets the update rate for the picture in seconds | ||
flavour | string | Selection of a display variant. See also :ref:’flavour’. | ||
class | string | Add this value to the CSS class so that it can be formated by a user provided style sheet. |
Allowed child-elements und their attributes¶
Element | Attribute | |||
---|---|---|---|---|
Structure | Name | Content | Description | |
|
colspan | decimal | Amount of coloumns this widget sould be wide. | |
colspan-m | decimal | Overrules the amount of coloumns on a medium screen. | ||
colspan-s | decimal | Overrules the amount of coloumns on a small screen. | ||
rowspan | decimal | Amount of rows this widget should be high. | ||
x | string | Horizontal position of the widget for 2D pages. | ||
y | string | Vertical position of the widget for 2D pages. | ||
z | string | Reserved for future use. | ||
width | string | Width for the widget for 2D pages. |
Element | Attribute | |||
---|---|---|---|---|
Structure | Name | Content | Description | |
|
name | string | ||
type | string | |||
flavour | string | Selection of a display variant. See also :ref:’flavour’. | ||
color | string | |||
styling | string | |||
class | string | Add this value to the CSS class so that it can be formated by a user provided style sheet. | ||
|
string | Text to display a label for the widget. |
Examples¶
It is possible to manually edit the visu_config.xml and add an entry for the Image widget.
Caution
Make sure that you only use UTF-8 encoded characters by settings the encoding in your XML-editor to UTF-8 mode!
<image src="icon/CometVisu_orange.png" width="45px" height="32px">
<layout colspan="2"/>
</image>
Footnotes
[1] | The simple view might not show everything. To see all elements/attributes use the expert view. |