---
title: Create Charts with RUM Custom Metrics
description: >-
  Learn how to visualize your RUM custom metrics as charts in dashboards and
  notebooks.
breadcrumbs: >-
  Docs > RUM & Session Replay > Real User Monitoring & Session Replay Guides >
  Create Charts with RUM Custom Metrics
---

> For the complete documentation index, see [llms.txt](https://docs.datadoghq.com/llms.txt).

# Create Charts with RUM Custom Metrics

## Overview{% #overview %}

[RUM-based custom metrics](https://docs.datadoghq.com/real_user_monitoring/platform/generate_metrics.md) let you summarize event data from your browser and mobile applications and visualize trends for up to 15 months. After you [create a custom metric](https://docs.datadoghq.com/real_user_monitoring/platform/generate_metrics.md), you can use it anywhere Datadog metrics appear, including dashboards, notebooks, and SLOs.

## Add a RUM custom metric to a dashboard{% #add-a-rum-custom-metric-to-a-dashboard %}

1. Open an existing dashboard or [create a dashboard](https://app.datadoghq.com/dashboard/lists).
1. Click **Add Widgets** and select a widget type. See Choose the right widget for guidance.
1. In the widget editor, set the data source to **Metrics**.
1. Enter your custom metric name, for example `rum.sessions.count_by_geography`.
1. Apply tag filters to scope the data, for example `env:prod`.
1. Select a **group by** tag to break down the data, for example `@application.name`.
1. Click **Save** to add the widget to your dashboard.

## Choose the right widget{% #choose-the-right-widget %}

The following table maps common RUM use cases to widget types:

| Use case                                                                                                                                                            | Recommended widget |
| ------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------ |
| Error rate or session count over time                                                                                                                               | Timeseries         |
| Top pages by load time                                                                                                                                              | Top List           |
| Single KPI such as crash-free rate                                                                                                                                  | Query Value        |
| Distribution of load times (requires [percentile aggregation](https://docs.datadoghq.com/real_user_monitoring/platform/generate_metrics.md#percentile-aggregation)) | Distribution       |
| Breakdown by country or version                                                                                                                                     | Geomap or Top List |

## Combine metrics with formulas{% #combine-metrics-with-formulas %}

You can combine multiple RUM custom metrics in a single widget using formulas. This is useful for calculating derived values such as rates and ratios.

For example, to calculate a crash-free rate, create two custom metrics:

- **`rum.sessions.crash_free`**: A count of sessions that complete without a crash.
- **`rum.sessions.total`**: A count of all sessions.

In the widget editor, add both metrics as separate queries, then enter the formula `a / b * 100` to calculate the percentage.

{% image
   source="https://docs.dd-static.net/images/real_user_monitoring/guide/create-charts-with-custom-metrics/custom-metrics-formulas-example.3abcdc4e54446fa1075c88d7f803af1b.png?auto=format&fit=max&w=850 1x, https://docs.dd-static.net/images/real_user_monitoring/guide/create-charts-with-custom-metrics/custom-metrics-formulas-example.3abcdc4e54446fa1075c88d7f803af1b.png?auto=format&fit=max&w=850&dpr=2 2x"
   alt="Widget editor showing two RUM custom metric queries combined with a formula to calculate crash-free rate as a percentage." /%}

## Use template variables for reusable charts{% #use-template-variables-for-reusable-charts %}

Template variables let you create dashboards that work across multiple applications, environments, or versions without duplicating widgets.

To add a template variable to a dashboard:

1. Click **Add Variable** at the top of the dashboard.
1. Select **Metrics** as the data source.
1. Choose a tag key such as `application.name`, `env`, or `version`.

After you add the variable, reference it in widget queries using the `$variable_name` syntax. For example, filter a widget to `application.name:$application` to let viewers select which application to display.

## Charting examples{% #charting-examples %}

### Track conversion funnel drop-off by country{% #track-conversion-funnel-drop-off-by-country %}

Use a **Geomap** widget with a custom metric that counts completed checkout sessions grouped by country. Filter to `@session.type:user` to exclude synthetic traffic, and group by the `@geo.country` tag to visualize where users drop off in your conversion funnel.

### Monitor crash-free rate by release version{% #monitor-crash-free-rate-by-release-version %}

Use a **Timeseries** widget with the formula pattern from the Combine metrics with formulas section to track crash-free rate over time. Group by `version` to compare stability across releases and detect regressions introduced by specific builds.

### Visualize page load performance trends{% #visualize-page-load-performance-trends %}

Use a **Distribution** widget with a distribution metric that has percentile aggregation enabled to display P50, P75, P90, and P99 values. Filter to a specific view name to focus on a critical page, such as a checkout or sign-up flow.

## Further reading{% #further-reading %}

- [Generate Custom Metrics from RUM Events](https://docs.datadoghq.com/real_user_monitoring/platform/generate_metrics.md)
- [Create alerts with RUM data](https://docs.datadoghq.com/real_user_monitoring/guide/alerting-with-rum.md)
- [RUM Dashboards](https://docs.datadoghq.com/real_user_monitoring/platform/dashboards.md)
- [Dashboards](https://docs.datadoghq.com/dashboards.md)