Daily Summary Grid

Displays metric or statistic data through columns in a bar chart.

Bar Chart

This chart uses a category-based X-axis, so you must use this widget to load aggregated data, for instance, the count of machines grouped by model name.

Pareto Line

When displaying event statistics, e.g. the count or sum of elapsed time from each event, it is possible to display the Pareto Line on the bars sorted by decreasing value.

For example, the image below displays the total time spent by the machine for each fault event type.
The Pareto Line enables the DPS user (e.g., technician, operations manager) to focus on the events that generate the most downtime.

In this case, the first two event types allocate 79% of the total failure time.
So it will be sufficient to try to solve these two problems to increase the machine's uptime, even noticeably (80-20 rule).
The other events, those after 79% are currently less important.

To configure the Pareto Line, you must:

In the Statistics, select the option Sorting as descending.
On the Bar Chart, enable the option Show Pareto Line.

Multiple Things Charting

The Bar Chart can also be placed within the Location or Custom details, and display the data aggregated on the underlying objects.
For instance, in a customer details page, you can display the count of failures over a period aggregated by product.

Optionally, you can change the set of things the chart is working on by coupling it with a Search Field available on the same page.

Template Syntax

Below you can find some examples of how to use the component within a template.


        <bar-chart-widget-v2 title="Alert Count">
        <statistic resource="alert" aggregation="COUNT" groupBy="MONTH"></statistic>
        </bar-chart-widget-v2>

Component Reference

Here is a comprehensive list of all the elements and properties that can be used to configure the component.

Daily Summary Grid `<daily-summary-grid-widget>`

Description	The description of the widget. Name: description Type: STRING \| Optional `description="abc"`
Title	The title displayed on the top part of the widget box. Name: title Type: STRING \| Optional `[title]="'abc'"`
Data
Default Loading Period	The default filtering period applied when entering the page. Name: config.defaultPeriod Type: PERIODS \| Optional Default Value: LAST_30_DAYS `[config]="{defaultPeriod: 'LAST_30_DAYS'}"`
Period Reference	Name: inputs.periodRef Type: STRING \| Optional `[inputs]="{periodRef: 'abc'}"`
Events
Event Names	The exact names of the events to display on the Y axis. If there are no occurrences for a given event, it will be discarded. Name: config.eventNames Type: STRING \| Optional `[config]="{eventNames: 'abc'}"`
Event Query	The query used to filter events. Name: config.eventQuery Type: QUERY \| Optional Predicates: beginsWith, eq, neq, gt, gte, isEmpty, isNotEmpty, lt, lte, like, notLike `[config]="{eventQuery: [{property:'prop1', predicate: 'eq', value: 'foo'}, {property:'prop2', predicate: 'in', value: ['bar', 'baz']}]}"`
Event Query Reference	The id of the page's <search-field> used to filter events. Name: inputs.eventQueryRef Type: STRING \| Optional `[inputs]="{eventQueryRef: 'abc'}"`
Show Event Count	The number of daily events is displayed in each cell of the grid. Name: config.showEventCount Type: BOOLEAN \| Optional Default Value: false `[config]="{showEventCount: true}"`
Show Event Severity	The cell related to an event is colored according to the event severity. Name: config.showEventSeverity Type: BOOLEAN \| Optional Default Value: false `[config]="{showEventSeverity: true}"`
Sort By Occurrences	If selected, events are sorted by frequency (in descending order), otherwise by name (in ascending order). Name: config.sortByOccurrences Type: BOOLEAN \| Optional Default Value: false `[config]="{sortByOccurrences: true}"`
Metrics
Metric Group Names	The exact names of the metric groups to display on the Y axis. Name: config.metricGroupNames Type: STRING \| Optional `[config]="{metricGroupNames: 'abc'}"`
Show Changes Only	Name: config.showChangesOnly Type: BOOLEAN \| Optional Default Value: false `[config]="{showChangesOnly: true}"`
Show Metric Highlight Count	The number of daily metric highlights is displayed in each cell of the grid. Name: config.showMetricHighlightCount Type: BOOLEAN \| Optional Default Value: false `[config]="{showMetricHighlightCount: true}"`
Rendering
CSS Class	The name(s) of the CSS class used to customize the widget layout. Name: class Type: STRING \| Optional `class="abc"`
Visibility Condition	The expression that allows you to reduce the visibility of the element. Name: ngIf Type: STRING \| Optional `ngIf="abc"`
Sub Elements
Metric	The metric whose current value must be displayed within the widget.

Metric `<metric>`

Filter	The name of the filter used to transform and display values. Name: filter Type: FILTER \| Optional `filter="dateFormat"`
Name	The metric whose value(s) must be loaded by the widget. Name: name Type: METRIC \| Required `name="metricName"`
Unit	The unit of measurement to be displayed along the value. Name: unit Type: STRING \| Optional `unit="abc"`
Display Options
Group	The name used to group similar metrics together. The widget will display a row for each group or metric without a group. Name: config.group Type: STRING \| Optional `[config]="{group: 'abc'}"`
Highlight	Define what the widget should display for the metric. You can choose whether to highlight each time the metric value is changed (e.g. settings) or whether to highlight when the metric value is in WARNING or CRITICAL status. Name: config.highlight Type: ENUM \| Optional Values: VALUE_CHANGE, VALUE_SEVERITY Default Value: VALUE_CHANGE `[config]="{highlight: 'VALUE_CHANGE'}"`