Widgets catalogue
Closer view to the widget's settings.
For Dashboard and widget's setup, please refer here.
Value widgets
Usage of value widgets is, when displaying data in text form is needed.
Single value widget
Serves the purpose of displaying just a single value.
Value can be of type: string, boolean, number.
Single value can display just a date (convert e.g. unix timestamp to human readable date), if needed.
Multiple value widget
Serves the purpose displaying n values in one widget.
Except displaying n values in one widget, multiple value widget contents the same features as Single value widget.
Values can be of type: string, boolean, number.
Status indicator widget
Status indicator widget displays a number value and a color indication based on defined boundaries.
Value can be of type: number.
Table widget
Table widget can display multiple values in the table form.
Values can be of type: string, boolean, number.
Tool widgets
Tool widgets serves the purpose of a "button" - that when clicked - open a new tab in the browser with a link (URL address) specified in the configuration of the widget. Images for a tool widget can be loaded directly in the application's public folder or loaded as a base64 string image.
Chart widgets
Usage of chart widgets is, when displaying data in graphical form is needed.
Recharts are used as library for rendering data in the chart form.
BarChart widget
BarChart widget has 4 types of displaying data:
BarChart widget with sample data
Displaying the data based on some key on the timeline.
BarChart widget with aggregated data
Displaying count of the data based on some key on the timeline.
BarChart widget with grouped data
Displaying the data based on key by the total count.
BarChart widget with data table
Displaying the chart data in the table. This feature can be enabled in the chart settings and activated by clicking the button in top right corner of the widget.
AreaChart widget
Contains the same features as BarChart widget, but it displays the data in the widget in area form.
ScatterChart widget
Contains the same features as BarChart widget, but it displays the data in the widget in scatter form.
PieChart widget
PieChart displays only grouped data in form of pie chart and table.
PieChart with gradient colors
In this example, tooltip is used for displaying detailed informations about the particular part (tooltip is not displayed in this image).
PieChart with multiple colors
In this example, tooltip is replaced by indication of an active part in the upper left corner of the widget.
FlowChart widget
Mermaid is used as a library for rendering flowcharts.
Mermaid playground can be found here.
