Metric

Overview

The Metric component can be utilized to present and visualize analytics data.

Properties

Name	Type	Description
name	string	Component name
value	{ main: any; additional: any }	Computed metric's value

Methods

Name	Parameters	Returns	Description
setData	data: object | object[]	void	Set component data. Data is an object or array of objects with arbitrary structure.

Triggers

Name	Description
On Init	Triggered when the component is initialized

Working with the component

Accessing calculated metric value

Using metrics, you can calculate a sum or count of any specific values you need. You can also use the metric value in other fields for further calculations - you can refer to it as {{ui.metric.value.main}} or {{ui.metric.value.additional}}, depending on which value you need to use.

Let's say you have a metric that displays the amount of logged hours for each employee and their hourly rate. You also want to have a separate field to display the salary of each employee based on the metric data. Here's how you can do that:

1. Add a Text component to the canvas.

2. In the component's Value property, specify the following formula to calculate the salary:

{{ui.employeesMetric.value.main*ui.employeesMetric.value.additional}}

{{ui.employeesMetric.value.main}} is the main field of the metric representing the amount of logged hours.

{{ui.employeesMetric.value.additional}} is the additional field of the metric representing the hourly rate.

As a result, you will get the required amount representing the employee's salary.