Indicator

​
Indicators are important tools to benchmark, target and monitor performance.
Different types of indicators are used in monitoring and evaluation, such as ‘quantitative’ or ‘qualitative’. Colors and thresholds can be set to guide decision.
The method to use
The method is shimoku.plt.indicator()
Availble font colors: success, warning, error, grey
Alignment: left , center, right by default the value right is taken. Note that the alignment only applies to the value, not to the title nor description.
Examples
1. Default configuration
data_ = [
    {
        "description": "",
        "title": "Estado",
        "value": "Abierto",
        "align": "center",
    },
    {
        "description": "",
        "title": "Price ($)",
        "value": "455",
        "color": "success",
    },
    {
        "description": "This is a description",
        "title": "Volumen",
        "value": "41153"
    },
    {
        "description": "",
        "title": "Cambio €/quot;,
        "value": "1.1946",
    },
]
  
shimoku.plt.indicator(
    data=data_,
    menu_path='test/indicator-1',
    order=0,
    rows_size=2, cols_size=12,
    value='value',
    header='title',
    footer='description',
    align='align',
    color='color'
)
With output:
Indicator with the default configuration and four sets of data.
2. Modifying size and padding
It is possible to personalize the size and add padding. One example could be obtained using:
data_ = [
        {
            "description": "Seda incolora",
            "title": "Largo (m)",
            "value": "1200",
            "color": "grey",
        },
        {
            "description": "Precio",
            "title": "Cambio €/quot;,
            "value": "1.19",
            "color": "warning",
​
        },
]
​
shimoku.plt.indicator(
    data=data_,
    menu_path='test/indicator-3',
    order=0,
    rows_size=2, cols_size=7,
    padding="0,0,0,2",
    value='value',
    header='title',
    footer='description',
    color='color'
)
The result is:
Note the space before the component using  padding="0,0,0,2",   and size with cols_size=7. Size can be modified with attention to the text to be fit in.
Indicators can be set to run in real time, see it at:
Real Time
Featured content
​Changing menu_path
The menu_path can be modified.

​Using the Grid​
It is possible to use any number of rows.

Indicators

Alert indicator

Last modified 3mo ago

Copy link

On this page

The method to use

Examples

1. Default configuration

2. Modifying size and padding