Docs: Add data links shared content (#86893)

* Added data link options shared file and added file to relevant visualizations

* Updated some text and links in canvas

* Added shared file to xy chart

* Fixed list of visualizations using shared file

* Removed unneeded level offset

* Removed future tense

* Update data links description

* Updated wording

* Removed redundant sentence
pull/87197/head
Isabel Matwawana 1 year ago committed by GitHub
parent ee4422d1e2
commit 1ef0e240e9
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
  1. 2
      docs/sources/panels-visualizations/configure-data-links/index.md
  2. 7
      docs/sources/panels-visualizations/visualizations/bar-chart/index.md
  3. 4
      docs/sources/panels-visualizations/visualizations/bar-gauge/index.md
  4. 6
      docs/sources/panels-visualizations/visualizations/candlestick/index.md
  5. 12
      docs/sources/panels-visualizations/visualizations/canvas/index.md
  6. 4
      docs/sources/panels-visualizations/visualizations/gauge/index.md
  7. 4
      docs/sources/panels-visualizations/visualizations/geomap/index.md
  8. 4
      docs/sources/panels-visualizations/visualizations/heatmap/index.md
  9. 4
      docs/sources/panels-visualizations/visualizations/histogram/index.md
  10. 4
      docs/sources/panels-visualizations/visualizations/stat/index.md
  11. 4
      docs/sources/panels-visualizations/visualizations/state-timeline/index.md
  12. 7
      docs/sources/panels-visualizations/visualizations/status-history/index.md
  13. 4
      docs/sources/panels-visualizations/visualizations/table/index.md
  14. 4
      docs/sources/panels-visualizations/visualizations/time-series/index.md
  15. 4
      docs/sources/panels-visualizations/visualizations/trend/index.md
  16. 8
      docs/sources/panels-visualizations/visualizations/xy-chart/index.md
  17. 15
      docs/sources/shared/visualizations/datalink-options.md
  18. 2
      docs/sources/shared/visualizations/tooltip-options-1.md

@ -26,7 +26,7 @@ weight: 80
# 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:

@ -191,6 +191,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="<GRAFANA_VERSION>" leveloffset="+2" >}}
## Data links
{{< docs/shared lookup="visualizations/datalink-options.md" source="grafana" version="<GRAFANA_VERSION>" >}}
## Thresholds
{{< docs/shared lookup="visualizations/thresholds-options-1.md" source="grafana" version="<GRAFANA_VERSION>" >}}
@ -208,4 +212,7 @@ You can set standard min/max options to define hard limits of the Y-axis. For mo
[Standard options definitions]: "/docs/grafana/ -> /docs/grafana/<GRAFANA_VERSION>/panels-visualizations/configure-standard-options#max"
[Standard options definitions]: "/docs/grafana-cloud/ -> /docs/grafana-cloud/visualizations/panels-visualizations/configure-standard-options#max"
[Configure data links]: "/docs/grafana/ -> /docs/grafana/<GRAFANA_VERSION>/panels-visualizations/configure-data-links"
[Configure data links]: "/docs/grafana-cloud/ -> /docs/grafana-cloud/visualizations/panels-visualizations/configure-data-links"
{{% /docs/reference %}}

@ -130,6 +130,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="<GRAFANA_VERSION>" >}}
## Thresholds
{{< docs/shared lookup="visualizations/thresholds-options-2.md" source="grafana" version="<GRAFANA_VERSION>" >}}

@ -110,7 +110,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][time series visualization] visualization.
@ -122,6 +122,10 @@ The candlestick visualization is based on the time series visualization. It can
{{< docs/shared lookup="visualizations/tooltip-options-2.md" source="grafana" version="<GRAFANA_VERSION>" >}}
## Data links
{{< docs/shared lookup="visualizations/datalink-options.md" source="grafana" version="<GRAFANA_VERSION>" >}}
## Thresholds
{{< docs/shared lookup="visualizations/thresholds-options-1.md" source="grafana" version="<GRAFANA_VERSION>" >}}

@ -151,7 +151,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/), but only for all elements except drone and button elements. You can add a data link by following these steps:
Canvases support [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.
@ -162,7 +162,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][]. 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.
@ -180,3 +180,11 @@ If multiple elements use the same field name, and you want to control which elem
## Value mappings
{{< docs/shared lookup="visualizations/value-mappings-options.md" source="grafana" version="<GRAFANA_VERSION>" >}}
{{% docs/reference %}}
[data links]: "/docs/grafana/ -> /docs/grafana/<GRAFANA_VERSION>/panels-visualizations/configure-data-links"
[data links]: "/docs/grafana-cloud/ -> /docs/grafana-cloud/visualizations/panels-visualizations/configure-data-links"
[add field from calculation transform]: "/docs/grafana/ -> /docs/grafana/<GRAFANA_VERSION>/panels-visualizations/query-transform-data/transform-data#add-field-from-calculation"
[add field from calculation transform]: "/docs/grafana-cloud/ -> /docs/grafana-cloud/visualizations/panels-visualizations/query-transform-data/transform-data#add-field-from-calculation"
{{% /docs/reference %}}

@ -105,6 +105,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="<GRAFANA_VERSION>" >}}
## Thresholds
{{< docs/shared lookup="visualizations/thresholds-options-2.md" source="grafana" version="<GRAFANA_VERSION>" >}}

@ -603,6 +603,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="<GRAFANA_VERSION>" >}}
## Thresholds
{{< docs/shared lookup="visualizations/thresholds-options-2.md" source="grafana" version="<GRAFANA_VERSION>" >}}

@ -174,6 +174,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="<GRAFANA_VERSION>" >}}
### Exemplars
Set the color used to show exemplar data.

@ -133,6 +133,10 @@ Gradient color is generated based on the hue of the line color.
{{< docs/shared lookup="visualizations/thresholds-options-2.md" source="grafana" version="<GRAFANA_VERSION>" >}}
## Data links
{{< docs/shared lookup="visualizations/datalink-options.md" source="grafana" version="<GRAFANA_VERSION>" >}}
{{% docs/reference %}}
[color scheme]: "/docs/grafana/ -> /docs/grafana/<GRAFANA_VERSION>/panels-visualizations/configure-standard-options#color-scheme"
[color scheme]: "/docs/grafana-cloud/ -> /docs/grafana-cloud/visualizations/panels-visualizations/configure-standard-options#color-scheme"

@ -189,6 +189,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="<GRAFANA_VERSION>" >}}
## Thresholds
{{< docs/shared lookup="visualizations/thresholds-options-2.md" source="grafana" version="<GRAFANA_VERSION>" >}}

@ -138,6 +138,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="<GRAFANA_VERSION>" >}}
## Data links
{{< docs/shared lookup="visualizations/datalink-options.md" source="grafana" version="<GRAFANA_VERSION>" >}}
## Thresholds
{{< docs/shared lookup="visualizations/thresholds-options-2.md" source="grafana" version="<GRAFANA_VERSION>" >}}

@ -118,6 +118,10 @@ To assign colors to boolean or string values, use the [Value mappings][].
{{< docs/shared lookup="visualizations/tooltip-options-1.md" source="grafana" version="<GRAFANA_VERSION>" >}}
## Data links
{{< docs/shared lookup="visualizations/datalink-options.md" source="grafana" version="<GRAFANA_VERSION>" >}}
## Thresholds
{{< docs/shared lookup="visualizations/thresholds-options-2.md" source="grafana" version="<GRAFANA_VERSION>" >}}
@ -129,4 +133,7 @@ To assign colors to boolean or string values, use the [Value mappings][].
{{% docs/reference %}}
[Value mappings]: "/docs/grafana/ -> /docs/grafana/<GRAFANA_VERSION>/panels-visualizations/configure-value-mappings"
[Value mappings]: "/docs/grafana-cloud/ -> /docs/grafana-cloud/visualizations/panels-visualizations/configure-value-mappings"
[Color scheme]: "/docs/grafana/ -> /docs/grafana/<GRAFANA_VERSION>/panels-visualizations/configure-standard-options#color-scheme"
[Color scheme]: "/docs/grafana-cloud/ -> /docs/grafana-cloud/visualizations/panels-visualizations/configure-standard-options#color-scheme"
{{% /docs/reference %}}

@ -234,6 +234,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="<GRAFANA_VERSION>" >}}
## Thresholds
{{< docs/shared lookup="visualizations/thresholds-options-2.md" source="grafana" version="<GRAFANA_VERSION>" >}}

@ -301,6 +301,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="<GRAFANA_VERSION>" >}}
## Thresholds
{{< docs/shared lookup="visualizations/thresholds-options-1.md" source="grafana" version="<GRAFANA_VERSION>" >}}

@ -46,6 +46,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="<GRAFANA_VERSION>" >}}
## Data links
{{< docs/shared lookup="visualizations/datalink-options.md" source="grafana" version="<GRAFANA_VERSION>" >}}
## Thresholds
{{< docs/shared lookup="visualizations/thresholds-options-1.md" source="grafana" version="<GRAFANA_VERSION>" >}}

@ -230,6 +230,10 @@ The transform option is only available as an override.
{{< docs/shared lookup="visualizations/multiple-y-axes.md" source="grafana" version="<GRAFANA_VERSION>" leveloffset="+2" >}}
## Data links
{{< docs/shared lookup="visualizations/datalink-options.md" source="grafana" version="<GRAFANA_VERSION>" >}}
## Other visualization options
### Panel options
@ -240,10 +244,6 @@ Learn about [panel options][] that you can set for a visualization.
Learn about [standard options][] that you can set for a visualization.
### Data links
Learn about [data links][] that you can set for a visualization.
### Field overrides
Learn about [field overrides][Configure field overrides] that you can set for a visualization.

@ -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/).

@ -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.

Loading…
Cancel
Save