---
title: Metric Widget
slug: technical-docs/6B-0-metric-widget
docTags: 
createdAt: 2024-10-08T11:22:38.011Z
---

# Introduction

The **Metric Widget **presents a high-level interpretation based on metrics derived from data collected over an extended period. By aggregating multiple measurements, it offers users a broader understanding of their health trends and insights. Ideal for users interested in comprehensive health tracking, this widget can display aggregated values like stress levels or fitness scores. It’s designed to provide an overview that aids in interpreting long-term health progress.

::Image[]{src="https://api.archbee.com/api/optimize/_0R_DnpmBBLLXmaoWvG2u/FhhxwhMOdxv2Lug3JVbp4_image.png" size="44" width="1390" height="1088" position="center" showCaption="false"}

:::hint{type="success"}
For more information on the metric widget's structure and functionalities, refer to our product documentation: [Metrics](docId\:mfrm6YjoqAS0HRPk4h__i) .
:::

[View the IntelliWidgets.js reference ->](docId\:fmag0nP7LDLer92Db4X_I) 

# Usage

## Creating the widget

The code snippet below creates a Metric widget and [mounts](docId\:sXVSW2jFSOhr7XbXEYZ_J) it to the DOM:

:::CodeblockTabs
Create and mount widget

```javascript
const intelli = IntelliProveWidgets("user_action_token");

const config = { /* config */ };
const variation = "default";
const themeOverrides = { /* theme overrides */ };
intelli.mountWidget(
    "#heart-rate-tile",
    "metric",
    config,
    variation,
    themeOverrides
);
```
:::

## Config

The Metric widget requires additional configuration parameters that describes which parameter should be displayed.

:::CodeblockTabs
Config

```javascript
const config = {
   parameter: "sleep_quality"
}
```
:::

| **Property**              | **Description**  |
| ------------------------- | ---------------- |
| `parameter`<br />*string* | Metric of choice |

List of available [metrics](docId\:yEqwSkx81EJu_Z8N3DjhY):

| **Parameter**        |
| -------------------- |
| mental\_health\_risk |
| mental\_stress       |
| sleep\_quality       |
| energy\_balance      |
| general\_fitness     |
| hypertension\_risk   |

:::hint{type="warning"}
**Note:&#x20;**&#xA;The General Fitness Level widget is specified by `general_fitness` in the V2 SDK. Throughout the rest of the product, including the API and the V1 SDK, the programmatic name is `general_fitness_level`. We realise this is inconsistent, and a fix is on the way to support using `general_fitness_level` in the V2 SDK as well.d
:::

## Variation

Reserved for future use.

## Theme Overrides

The Metric Widget allows [individual fine-tuning of the appearance](docId:2kL5Bnrb-6uIcQrFAqsiG).