Components - KPIs

KPI Card

Card to show off metrics and values. Has an icon, the KPI number and a small descriptive text.

An ods-aggregation example

Count the number of record of a dataset or compute the average/sum/min/max of a numeric field. On the left, the number of US hospitals. On the right, the average humidity in France recorded these past 11 years.

For more information about how to compute metrics, see ods-aggregation resource.

Flip KPI

This card flip on user interaction to reveal more details about the dataset and how it is computed. This component will stretch vertically according to content size. If your content is too large, the horizontal overflow will be hidden on the back face.

KPI sync flip

By default flip kpi will be independant. If you want multiple KPIs to all to flip when one is clicked, you have lift the state variable to a containing element.