diff --git a/docs/sources/panels-visualizations/configure-data-links/index.md b/docs/sources/panels-visualizations/configure-data-links/index.md index 194c3e33eaa..5e7b3c2c380 100644 --- a/docs/sources/panels-visualizations/configure-data-links/index.md +++ b/docs/sources/panels-visualizations/configure-data-links/index.md @@ -122,7 +122,7 @@ refs: # Configure data links -Data links allow you to provide more granular context to your links. You can create links that include the series name or even the value under the cursor. For example, if your visualization shows four servers, you can add a data link to one or two of them. You can also link panels using data links. +Data links allow you to link to other panels, dashboards, and external resources while maintaining the context of the source panel. You can create links that include the series name or even the value under the cursor. For example, if your visualization shows four servers, you can add a data link to one or two of them. The link itself is accessible in different ways depending on the visualization. For the time series visualization you need to click a data point or line: diff --git a/docs/sources/panels-visualizations/visualizations/bar-chart/index.md b/docs/sources/panels-visualizations/visualizations/bar-chart/index.md index 3a6ea730693..9f0ea1ed8fc 100644 --- a/docs/sources/panels-visualizations/visualizations/bar-chart/index.md +++ b/docs/sources/panels-visualizations/visualizations/bar-chart/index.md @@ -207,6 +207,10 @@ You can set standard min/max options to define hard limits of the Y-axis. For mo {{< docs/shared lookup="visualizations/multiple-y-axes.md" source="grafana" version="" leveloffset="+2" >}} +## Data links + +{{< docs/shared lookup="visualizations/datalink-options.md" source="grafana" version="" >}} + ## Thresholds {{< docs/shared lookup="visualizations/thresholds-options-1.md" source="grafana" version="" >}} diff --git a/docs/sources/panels-visualizations/visualizations/bar-gauge/index.md b/docs/sources/panels-visualizations/visualizations/bar-gauge/index.md index 3fc5fdded64..5ea6446a76b 100644 --- a/docs/sources/panels-visualizations/visualizations/bar-gauge/index.md +++ b/docs/sources/panels-visualizations/visualizations/bar-gauge/index.md @@ -136,6 +136,10 @@ Automatically show y-axis scrollbar when there's a large amount of data. This option only applies when bar size is set to manual. {{% /admonition %}} +## Data links + +{{< docs/shared lookup="visualizations/datalink-options.md" source="grafana" version="" >}} + ## Thresholds {{< docs/shared lookup="visualizations/thresholds-options-2.md" source="grafana" version="" >}} diff --git a/docs/sources/panels-visualizations/visualizations/candlestick/index.md b/docs/sources/panels-visualizations/visualizations/candlestick/index.md index 4e20bcb09d5..1d76ebe9d6b 100644 --- a/docs/sources/panels-visualizations/visualizations/candlestick/index.md +++ b/docs/sources/panels-visualizations/visualizations/candlestick/index.md @@ -116,7 +116,7 @@ If your data can't be mapped to these dimensions for some reason (for example, b ![Open, High, Low, and Close fields in the panel editor](/media/docs/grafana/panels-visualizations/screenshot-olhc-options-10.3.png) -## Additional fields +### Additional fields The candlestick visualization is based on the time series visualization. It can visualize additional data dimensions beyond open, high, low, close, and volume The **Include** and **Ignore** options allow it to visualize other included data such as simple moving averages, Bollinger bands and more, using the same styles and configurations available in the [time series](ref:time-series-visualization) visualization. @@ -128,6 +128,10 @@ The candlestick visualization is based on the time series visualization. It can {{< docs/shared lookup="visualizations/tooltip-options-2.md" source="grafana" version="" >}} +## Data links + +{{< docs/shared lookup="visualizations/datalink-options.md" source="grafana" version="" >}} + ## Thresholds {{< docs/shared lookup="visualizations/thresholds-options-1.md" source="grafana" version="" >}} diff --git a/docs/sources/panels-visualizations/visualizations/canvas/index.md b/docs/sources/panels-visualizations/visualizations/canvas/index.md index 96d917c40f6..046f0b43320 100644 --- a/docs/sources/panels-visualizations/visualizations/canvas/index.md +++ b/docs/sources/panels-visualizations/visualizations/canvas/index.md @@ -15,6 +15,17 @@ labels: - oss title: Canvas weight: 100 +refs: + data-links: + - pattern: /docs/grafana/ + destination: /docs/grafana//panels-visualizations/configure-data-links/ + - pattern: /docs/grafana-cloud/ + destination: /docs/grafana-cloud/visualizations/panels-visualizations/configure-data-links/ + add-field-from-calculation-transform: + - pattern: /docs/grafana/ + destination: /docs/grafana//panels-visualizations/query-transform-data/transform-data/#add-field-from-calculation + - pattern: /docs/grafana-cloud/ + destination: /docs/grafana-cloud/visualizations/panels-visualizations/query-transform-data/transform-data/#add-field-from-calculation --- # Canvas @@ -139,7 +150,7 @@ The inline editing toggle lets you lock or unlock the canvas. When turned off th ### Data links -Canvases support [data links](https://grafana.com/docs/grafana/latest/panels-visualizations/configure-data-links/). You can create a data link for a metric-value element and display it for all elements that use the field name by following these steps: +Canvases support [data links](ref:data-links) for all elements except drone and button elements. You can add a data link by following these steps: 1. Set an element to be tied to a field value. 1. Turn off the inline editing toggle. @@ -150,7 +161,7 @@ Canvases support [data links](https://grafana.com/docs/grafana/latest/panels-vis 1. Hover over the element to display the data link tooltip. 1. Click on the element to be able to open the data link. -If multiple elements use the same field name, and you want to control which elements display the data link, you can create a unique field name using the [add field from calculation transform](https://grafana.com/docs/grafana/latest/panels-visualizations/query-transform-data/transform-data/#add-field-from-calculation). The alias you create in the transformation will appear as a field you can use with an element. +If multiple elements use the same field name, and you want to control which elements display the data link, you can create a unique field name using the [add field from calculation transform](ref:add-field-from-calculation-transform). The alias you create in the transformation will appear as a field you can use with an element. 1. In the panel editor for the canvas, click the **Transform** tab. 1. Select **Add field from calculation** from the list of transformations, or click **+ Add transformation** to display the list first. diff --git a/docs/sources/panels-visualizations/visualizations/gauge/index.md b/docs/sources/panels-visualizations/visualizations/gauge/index.md index 130105527d0..e227caadb31 100644 --- a/docs/sources/panels-visualizations/visualizations/gauge/index.md +++ b/docs/sources/panels-visualizations/visualizations/gauge/index.md @@ -111,6 +111,10 @@ Adjust the sizes of the gauge text. - **Title -** Enter a numeric value for the gauge title size. - **Value -** Enter a numeric value for the gauge value size. +## Data links + +{{< docs/shared lookup="visualizations/datalink-options.md" source="grafana" version="" >}} + ## Thresholds {{< docs/shared lookup="visualizations/thresholds-options-2.md" source="grafana" version="" >}} diff --git a/docs/sources/panels-visualizations/visualizations/geomap/index.md b/docs/sources/panels-visualizations/visualizations/geomap/index.md index ebaf1ca13fb..87435fe6b7b 100644 --- a/docs/sources/panels-visualizations/visualizations/geomap/index.md +++ b/docs/sources/panels-visualizations/visualizations/geomap/index.md @@ -614,6 +614,10 @@ Displays debug information in the upper right corner. This can be useful for deb - **None** displays tooltips only when a data point is clicked. - **Details** displays tooltips when a mouse pointer hovers over a data point. +## Data links + +{{< docs/shared lookup="visualizations/datalink-options.md" source="grafana" version="" >}} + ## Thresholds {{< docs/shared lookup="visualizations/thresholds-options-2.md" source="grafana" version="" >}} diff --git a/docs/sources/panels-visualizations/visualizations/heatmap/index.md b/docs/sources/panels-visualizations/visualizations/heatmap/index.md index 300db34b383..e1ea21d3b2f 100644 --- a/docs/sources/panels-visualizations/visualizations/heatmap/index.md +++ b/docs/sources/panels-visualizations/visualizations/heatmap/index.md @@ -182,6 +182,10 @@ When you set the **Tooltip mode** to **Single**, this option is displayed. This Choose whether you want to display the heatmap legend on the visualization by toggling the **Show legend** switch. +### Data links + +{{< docs/shared lookup="visualizations/datalink-options.md" source="grafana" version="" >}} + ### Exemplars Set the color used to show exemplar data. diff --git a/docs/sources/panels-visualizations/visualizations/histogram/index.md b/docs/sources/panels-visualizations/visualizations/histogram/index.md index 65b244be503..e72a391be0e 100644 --- a/docs/sources/panels-visualizations/visualizations/histogram/index.md +++ b/docs/sources/panels-visualizations/visualizations/histogram/index.md @@ -145,3 +145,7 @@ Gradient color is generated based on the hue of the line color. ## Thresholds {{< docs/shared lookup="visualizations/thresholds-options-2.md" source="grafana" version="" >}} + +## Data links + +{{< docs/shared lookup="visualizations/datalink-options.md" source="grafana" version="" >}} diff --git a/docs/sources/panels-visualizations/visualizations/stat/index.md b/docs/sources/panels-visualizations/visualizations/stat/index.md index 86eea1c6727..7f7b7d7f524 100644 --- a/docs/sources/panels-visualizations/visualizations/stat/index.md +++ b/docs/sources/panels-visualizations/visualizations/stat/index.md @@ -195,6 +195,10 @@ Adjust the sizes of the gauge text. - **Title -** Enter a numeric value for the gauge title size. - **Value -** Enter a numeric value for the gauge value size. +## Data links + +{{< docs/shared lookup="visualizations/datalink-options.md" source="grafana" version="" >}} + ## Thresholds {{< docs/shared lookup="visualizations/thresholds-options-2.md" source="grafana" version="" >}} diff --git a/docs/sources/panels-visualizations/visualizations/state-timeline/index.md b/docs/sources/panels-visualizations/visualizations/state-timeline/index.md index 89f49dffde8..a93c172488a 100644 --- a/docs/sources/panels-visualizations/visualizations/state-timeline/index.md +++ b/docs/sources/panels-visualizations/visualizations/state-timeline/index.md @@ -149,6 +149,10 @@ The visualization can be used with time series data as well. In this case, the t {{< docs/shared lookup="visualizations/tooltip-options-1.md" source="grafana" version="" >}} +## Data links + +{{< docs/shared lookup="visualizations/datalink-options.md" source="grafana" version="" >}} + ## Thresholds {{< docs/shared lookup="visualizations/thresholds-options-2.md" source="grafana" version="" >}} diff --git a/docs/sources/panels-visualizations/visualizations/status-history/index.md b/docs/sources/panels-visualizations/visualizations/status-history/index.md index 5938476e44c..2030e1bb7b8 100644 --- a/docs/sources/panels-visualizations/visualizations/status-history/index.md +++ b/docs/sources/panels-visualizations/visualizations/status-history/index.md @@ -129,6 +129,10 @@ To assign colors to boolean or string values, use the [Value mappings](ref:value {{< docs/shared lookup="visualizations/tooltip-options-1.md" source="grafana" version="" >}} +## Data links + +{{< docs/shared lookup="visualizations/datalink-options.md" source="grafana" version="" >}} + ## Thresholds {{< docs/shared lookup="visualizations/thresholds-options-2.md" source="grafana" version="" >}} diff --git a/docs/sources/panels-visualizations/visualizations/table/index.md b/docs/sources/panels-visualizations/visualizations/table/index.md index c6d940f416f..f91f0662a53 100644 --- a/docs/sources/panels-visualizations/visualizations/table/index.md +++ b/docs/sources/panels-visualizations/visualizations/table/index.md @@ -248,6 +248,10 @@ The system applies the calculation to all numeric fields if you do not select a If you want to show the number of rows in the dataset instead of the number of values in the selected fields, select the **Count** calculation and enable **Count rows**. +## Data links + +{{< docs/shared lookup="visualizations/datalink-options.md" source="grafana" version="" >}} + ## Thresholds {{< docs/shared lookup="visualizations/thresholds-options-2.md" source="grafana" version="" >}} diff --git a/docs/sources/panels-visualizations/visualizations/time-series/index.md b/docs/sources/panels-visualizations/visualizations/time-series/index.md index a76e1265f60..df948f8e0ca 100644 --- a/docs/sources/panels-visualizations/visualizations/time-series/index.md +++ b/docs/sources/panels-visualizations/visualizations/time-series/index.md @@ -326,6 +326,10 @@ The following image shows a bar chart with the **Green-Yellow-Red (by value)** c {{< figure src="/static/img/docs/time-series-panel/gradient_mode_scheme_bars.png" max-width="1200px" caption="Color scheme: Green-Yellow-Red" >}} +## Data links + +{{< docs/shared lookup="visualizations/datalink-options.md" source="grafana" version="" >}} + ## Thresholds {{< docs/shared lookup="visualizations/thresholds-options-1.md" source="grafana" version="" >}} diff --git a/docs/sources/panels-visualizations/visualizations/trend/index.md b/docs/sources/panels-visualizations/visualizations/trend/index.md index ad0a0c9aea2..f9e79a754b1 100644 --- a/docs/sources/panels-visualizations/visualizations/trend/index.md +++ b/docs/sources/panels-visualizations/visualizations/trend/index.md @@ -52,6 +52,10 @@ For example, you could represent engine power and torque versus speed where spee {{< docs/shared lookup="visualizations/tooltip-options-2.md" source="grafana" version="" >}} +## Data links + +{{< docs/shared lookup="visualizations/datalink-options.md" source="grafana" version="" >}} + ## Thresholds {{< docs/shared lookup="visualizations/thresholds-options-1.md" source="grafana" version="" >}} diff --git a/docs/sources/shared/visualizations/datalink-options.md b/docs/sources/shared/visualizations/datalink-options.md new file mode 100644 index 00000000000..e3d77551cf5 --- /dev/null +++ b/docs/sources/shared/visualizations/datalink-options.md @@ -0,0 +1,15 @@ +--- +title: Data link options +comments: | + This file is used in the following visualizations: bar chart, bar gauge, candlestick, gauge, geomap, heatmap, histogram, stat, state timeline, status history, table, time series, trend, xy chart +--- + +Data links allow you to link to other panels, dashboards, and external resources while maintaining the context of the source panel. You can create links that include the series name or even the value under the cursor. + +For each data link, set the following options: + +- **Title** +- **URL** +- **Open in new tab** + +To learn more, refer to [Configure data links](../../configure-data-links/). diff --git a/docs/sources/shared/visualizations/tooltip-options-1.md b/docs/sources/shared/visualizations/tooltip-options-1.md index 1ff0a90c821..31f35524625 100644 --- a/docs/sources/shared/visualizations/tooltip-options-1.md +++ b/docs/sources/shared/visualizations/tooltip-options-1.md @@ -1,5 +1,5 @@ --- -title: Tooltip mode +title: Tooltip options comments: | There are two tooltip shared files, tooltip-options-1.md and tooltip-options-2.md, to cover the most common combinations of options. Using two shared files ensures that content remains consistent across visualizations that share the same options and users don't have to figure out which options apply to a specific visualization when reading that content.