Displays the values of multiple metrics in a plain list or table with one column per metric.
Values are ordered by the timestamp descending, scrolling the list oldest values will be loaded automatically.
Design View
In the visual editor, you can find the Multi Metric List icon 
You can drag and drop the widget in the grid, and then according to your needs configure the following sub-elements:
Code View
Template Syntax
Below you can find some examples of how to use the component within a template.
<multi-metric-list-widget title="Events" mode="LOG">
<metric name="EventInfo" filter="messageWithSeverity"></metric>
</multi-metric-list-widget>
Component Reference
Here is a comprehensive list of all the elements and properties that can be used to configure the component.
| <multi-metric-list-widget> | |
|---|---|
| PROPERTIES | |
| CSS Class | The name(s) of the CSS class used to customize the widget layout.
Type: STRING | Optional class="my-custom-class" |
| Default Loading Period | The default date and time filtering period applied when entering the page.
Type: ENUM | Optional | Values: TODAY YESTERDAY LAST_7_DAYS LAST_30_DAYS THIS_MONTH LAST_MONTH defaultPeriodValue="LAST_7_DAYS" |
| End Date Variable | The <period-field>'s End Variable filtering data by end date.
Type: STRING | Optional endDateFieldRef="toDate" [DEPRECATED] Use the Period Variable property instead. |
| Export Enabled | The boolean flag indicating whether the data export is enabled.
Type: BOOLEAN | Optional | Values: true false [exportEnabled]="true" |
| Page Size | The number of results to load when scrolling down the list.
Type: INTEGER | Optional | Default: 20 [pageSize]="123" |
| Period Filter Enabled | The boolean flag indicating whether the embedded period filter is available.
Type: BOOLEAN | Optional | Values: true false [filterEnabled]="true" |
| Period Variable | The id of the page's variable providing the date range filtering period, for instance the id of a <period-filter-field>.
Type: STRING | Optional periodRef="period" |
| Refresh Interval | The interval to check for updates (e.g. P7D, PT36H).
The value is expressed using the ISO 8601 standard for durations.
Type: STRING | Optional | Default: PT30 refreshInterval="fooBar" |
| Show Timestamp Column | The boolean flag indicating whether the Timestamp column is visible.
Type: BOOLEAN | Optional | Values: true false [showTimestamp]="true" |
| Start Date Variable | The <period-field>'s Start Variable filtering data by start date.
Type: STRING | Optional startDateFieldRef="fromDate" [DEPRECATED] Use the Period Variable property instead. |
| Title | The title displayed on the top part of the widget box.
Type: STRING | Optional [title]="'Details'" |
| Visibility Condition | The expression that allows you to reduce the visibility of the element.
Type: STRING | Optional *ngIf="getUser().organizationId != null" |
| SUB-ELEMENTS | |
| Metric | The metric whose label and current value must be rendered as a widget row. multiple | optional <metric name="Temperature"></metric> |
| <metric> | |
|---|---|
| PROPERTIES | |
| Filter | The name of the filter used to transform and display values.
Type: FILTER | Optional filter="fooBarFilter" |
| Label | The metric alternative label.
Type: STRING | Optional label="Temperature" |
| Name | The metric whose value(s) must be loaded by the widget.
Type: METRIC | Mandatory name="Temperature" |
| Unit | The unit of measurement to be displayed along the value.
Type: STRING | Optional unit="°C" |
| Visibility Condition | The expression that allows you to reduce the visibility of the element.
Type: STRING | Optional *ngIf="getUser().organizationId != null" |
Comments
0 comments
Please sign in to leave a comment.