Skip to content

Commit 9dd35c4

Browse files
take Marco's feedback into account
1 parent 7e9204d commit 9dd35c4

File tree

1 file changed

+11
-9
lines changed

1 file changed

+11
-9
lines changed

explore-analyze/visualize/charts/metric-charts.md

Lines changed: 11 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -10,9 +10,11 @@ description: Instructions and best practices for building metric charts with Kib
1010

1111
Metric charts make important single values stand out on a dashboard. They're perfect for highlighting KPIs such as error rates or SLOs for example, and for making them understandable at a glance with dynamic coloring or trend indicators.
1212

13-
They work with any numeric data: plain numbers, percentages, or calculations like a count, sum, or average. You can get this numeric data from numeric fields stored in your {{es}} documents, or from aggregation functions and formulas that you can apply to any type of field.
13+
They work with any numeric data: plain numbers, percentages, or calculations like a count, sum, or average. You can get this numeric data from numeric fields stored in your {{es}} documents, or from aggregation functions and formulas that you can apply to any type of field. <br>
14+
You can also display strings by using the `Last value` aggregation function that picks up the last document, sorted by timestamp, in the current tine frame.
1415

15-
The best way to create metric charts in {{kib}} is with **Lens**.
16+
17+
To create metric charts in {{kib}}, you must use **Lens**.
1618

1719
![Metric chart representing an SLO with different layouts](../../images/metric-chart.png)
1820

@@ -38,9 +40,9 @@ Using the dropdown indicating **Bar**, select **Metric**.
3840
1. Select the {{data-source}} that contains your data.
3941
2. Define the **Primary metric** by dragging a field from the fields list to the chart. {{kib}} automatically selects an appropriate aggregation function like Sum, Average, or Count based on the field type. This is the only setting that your metric chart requires to display something.
4042
3. Optionally:
41-
- Add a secondary metric. You can use this secondary metric as a comparison value or as a trend indicator to show how the primary metric evolves over time.
42-
- Specify a maximum value.
43-
- Break down the metric into multiple tiles based on another dimension.
43+
- Add a [secondary metric](#secondary-metric-options). You can use this secondary metric as a comparison value or as a trend indicator to show how the primary metric evolves over time.
44+
- Specify a [maximum value](#max-value-options).
45+
- [Break down](#breakdown-options) the metric into multiple tiles based on another dimension.
4446

4547
Refer to [](#settings) to find all data configuration options for your metric chart.
4648
::::
@@ -49,7 +51,7 @@ Refer to [](#settings) to find all data configuration options for your metric ch
4951
Tweak the appearance of the chart to your needs. Consider the following best practices:
5052

5153
**Use color wisely**
52-
: Assign colors that match your users' expectations. Red typically means problems, yellow means caution, and green means good. But consider your specific context: for costs, lower might be better (green), while for revenue, higher is better (green).
54+
: Assign colors that match your users' expectations and consider your specific context: for costs, lower might be better, while for revenue, higher is better.
5355

5456
**Format for readability**
5557
: Round to appropriate precision. Showing 1.2M is clearer than 1,234,567.89 for high-level metrics. But show more precision when small changes matter.
@@ -91,7 +93,7 @@ To add trend indicators to your metric visualization:
9193

9294
3. In the secondary metric configuration, look for the **Color by value** option. The possible choices are:
9395
* **None**: No trend indicators (default)
94-
* **Static**: Shows the secondary metric as a badge with a single color that you select
96+
* **Static**: Shows the secondary metric as a badge with a fixed color that you select
9597
* **Dynamic**: Enables both color coding and directional icons based on the comparison
9698

9799
4. Select **Dynamic** coloring. More options appear.
@@ -107,7 +109,7 @@ To add trend indicators to your metric visualization:
107109

108110
7. The secondary metric does not automatically compare with the primary metric. Define the value to **Compare to**:
109111
* **Static value**: Compares against a fixed baseline value that you specify
110-
* **Primary metric**: Compares the secondary metric directly against the primary metric. This option is only available when the primary metric is numeric.
112+
* **Primary metric**: Compares the secondary metric directly against the primary metric by displaying the result of `Primary metric - Secondary metric`. This option is only available when the primary metric is numeric.
111113

112114
When you select this option, the secondary metric is automatically updated:
113115

@@ -264,7 +266,7 @@ The following examples show various configuration options that you can use for b
264266
: This example builds on the previous one to display the percentage of successful requests for the 10 countries with the most incoming requests on a monitoring dashboard:
265267

266268
* **Title**: "Successful requests (2xx)"
267-
* **Primary metric**: `count(kql='response.code >= "200" and response.code < "300"') / count(response.code)`
269+
* **Primary metric**: `count(kql='response.code >= 200 and response.code < 300') / count(response.code)`
268270
* **Value format**: `Percent`
269271
* **Color by value**: `Dynamic`. Green when above 95%, yellow between 75% and 95%, red when below
270272
* **Supporting visualization:** "Line" to show evolution over time

0 commit comments

Comments
 (0)