Multi Metric List

  • 2 minute(s) read

Displays the values of multiple metrics in a plain list or table with one column per metric.

Multi Metric List

Values are ordered by the timestamp descending, scrolling the list oldest values will be loaded automatically.

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 <multi-metric-list-widget>

Default Loading Period

The default date and time filtering period applied when entering the page.

Name: defaultPeriodValue

Type: ENUM | Optional

Values: TODAY, YESTERDAY, LAST_1_HOUR, LAST_6_HOURS, LAST_12_HOURS, LAST_24_HOURS, LAST_7_DAYS, LAST_30_DAYS, THIS_MONTH, LAST_MONTH, LAST_6_MONTHS, LAST_12_MONTHS, THIS_WEEK, LAST_WEEK, LAST_FULL_7_DAYS, LAST_FULL_30_DAYS, LAST_FULL_12_MONTHS

defaultPeriodValue="TODAY"

End Date Variable/

The <period-field>'s End Variable filtering data by end date.

Name: endDateFieldRef

Type: STRING | Optional

DEPRECATED

Use the Period Variable property.

endDateFieldRef="toDate"

Export Enabled

The boolean flag indicating whether the data export is enabled.

Name: exportEnabled

Type: BOOLEAN | Optional

Default Value: false

[exportEnabled]="true"

Page Size

The number of results to load when scrolling down the list.

Name: pageSize

Type: INTEGER | Optional

Default Value: 20

pageSize="123"

Period Filter Enabled

The boolean flag indicating whether the embedded period filter is available.

Name: filterEnabled

Type: BOOLEAN | Optional

Default Value: true

[filterEnabled]="false"

Period Variable

The id of the page's variable providing the date range filtering period, for instance the id of a <period-filter-field>.

Name: periodRef

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.

Name: refreshInterval

Type: STRING | Optional

Default Value: PT30

refreshInterval="abc"

Show Timestamp Column

The boolean flag indicating whether the Timestamp column is visible.

Name: showTimestamp

Type: BOOLEAN | Optional

Default Value: true

[showTimestamp]="false"

Start Date Variable/

The <period-field>'s Start Variable filtering data by start date.

Name: startDateFieldRef

Type: STRING | Optional

DEPRECATED

Use the Period Variable property instead.

startDateFieldRef="fromDate"

Title

The title displayed on the top part of the widget box.

Name: title

Type: STRING | Optional

[title]="'Details'"

Rendering

Collapse / Expand

The flag indicating whether the widget is collaspible.

Name: collapsible

Type: BOOLEAN | Optional

Default Value: false

[collapsible]="true"

CSS Class

The name(s) of the CSS class used to customize the widget layout.

Name: class

Type: STRING | Optional

class="my-custom-class"

Visibility Condition

The expression that allows you to reduce the visibility of the element.

Name: *ngIf

Type: STRING | Optional

*ngIf="getUser().organizationId != null"

Sub Elements

Metric

The metric whose label and current value must be rendered as a widget row.

Metric <metric>

Filter

The name of the filter used to transform and display values.

Name: filter

Type: FILTER | Optional

filter="fooBarFilter"

Label

The metric alternative label.

Name: label

Type: STRING | Optional

label="Temperature"

Name

The metric whose value(s) must be loaded by the widget.

Name: name

Type: METRIC | Required

name="Temperature"

Unit

The unit of measurement to be displayed along the value.

Name: unit

Type: STRING | Optional

unit="&deg;C"

Advanced

Visibility Condition

The expression that allows you to reduce the visibility of the element.

Name: *ngIf

Type: STRING | Optional

*ngIf="getUser().organizationId != null"