Skip to content

Commit

Permalink
Docs: add panel options shared content (#87258)
Browse files Browse the repository at this point in the history
* Added panel options shared file

* Added panel options shared file to visualizations pages

* Fixed version interpolation syntax and added Cloud links

* Fixed heading level of title

(cherry picked from commit f8d9f85)
  • Loading branch information
imatwawana authored and grafana-delivery-bot[bot] committed May 2, 2024
1 parent 31e116f commit bb77ab2
Show file tree
Hide file tree
Showing 27 changed files with 135 additions and 28 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -28,6 +28,10 @@ Use alert lists to display your alerts. You can configure the list to show the c

Customize your visualization using the following settings.

## Panel options

{{< docs/shared lookup="visualizations/panel-options.md" source="grafana" version="<GRAFANA_VERSION>" >}}

## Options

- **Group mode -** Choose between "Default grouping" to show alert instances grouped by their alert rule, or "Custom grouping" to group alert instances by a custom set of labels.
Expand Down Expand Up @@ -67,6 +71,6 @@ Choose which alert states to display in this visualization.
- Error

{{% docs/reference %}}
[Grafana Alerting overview]: "/docs/grafana/ -> /docs/grafana/<GRAFANA VERSION>/alerting"
[Grafana Alerting overview]: "/docs/grafana-cloud/ -> /docs/grafana/<GRAFANA VERSION>/alerting"
[Grafana Alerting overview]: "/docs/grafana/ -> /docs/grafana/<GRAFANA_VERSION>/alerting"
[Grafana Alerting overview]: "/docs/grafana-cloud/ -> /docs/grafana-cloud/alerting-and-irm/alerting"
{{% /docs/reference %}}
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,10 @@ weight: 100

The annotations list shows a list of available annotations you can use to view annotated data. Various options are available to filter the list based on tags and on the current dashboard.

## Panel options

{{< docs/shared lookup="visualizations/panel-options.md" source="grafana" version="<GRAFANA_VERSION>" >}}

## Annotation query

The following options control the source query for the list of annotations.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -46,6 +46,10 @@ have multiple time series and you want to compare their last and max value add t

{{< figure src="/static/img/docs/bar-chart-panel/bar-chart-time-series-v8-0.png" max-width="1025px" caption="Bar chart time series example" >}}

## Panel options

{{< docs/shared lookup="visualizations/panel-options.md" source="grafana" version="<GRAFANA_VERSION>" >}}

## Bar chart options

Use these options to refine your visualization.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -27,6 +27,10 @@ This panel can show one or more bar gauges depending on how many series, rows, o

{{< docs/play title="Bar Gauge" url="https://play.grafana.org/d/vmie2cmWz/" >}}

## Panel options

{{< docs/shared lookup="visualizations/panel-options.md" source="grafana" version="<GRAFANA_VERSION>" >}}

## Value options

Use the following options to refine how your visualization displays the value:
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -70,6 +70,10 @@ The data is converted as follows:

{{< figure src="/static/img/docs/candlestick-panel/candlestick.png" max-width="1065px" alt="A candlestick visualization showing the price movements of specific asset." >}}

## Panel options

{{< docs/shared lookup="visualizations/panel-options.md" source="grafana" version="<GRAFANA_VERSION>" >}}

## Mode

The mode options allow you to toggle which dimensions are used for the visualization.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -173,6 +173,10 @@ If multiple elements use the same field name, and you want to control which elem

{{< video-embed src="/media/docs/grafana/canvas-data-links-9-4-0.mp4" max-width="750px" caption="Data links demo" >}}

## Panel options

{{< docs/shared lookup="visualizations/panel-options.md" source="grafana" version="<GRAFANA_VERSION>" >}}

## Standard options

{{< docs/shared lookup="visualizations/standard-options.md" source="grafana" version="<GRAFANA_VERSION>" >}}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -28,6 +28,10 @@ Dashboard lists allow you to display dynamic links to other dashboards. The list

On each dashboard load, this panel queries the dashboard list, always providing the most up-to-date results.

## Panel options

{{< docs/shared lookup="visualizations/panel-options.md" source="grafana" version="<GRAFANA_VERSION>" >}}

## Options

Use these options to refine your visualization.
Expand All @@ -51,6 +55,6 @@ These options only apply if the **Search** option is selected.
> **Note:** When multiple tags and strings appear, the dashboard list displays those matching _all_ conditions.
{{% docs/reference %}}
[Dashboard URL variables]: "/docs/grafana/ -> /docs/grafana/<GRAFANA VERSION>/dashboards/build-dashboards/create-dashboard-url-variables"
[Dashboard URL variables]: "/docs/grafana-cloud/ -> /docs/grafana/<GRAFANA VERSION>/dashboards/build-dashboards/create-dashboard-url-variables"
[Dashboard URL variables]: "/docs/grafana/ -> /docs/grafana/<GRAFANA_VERSION>/dashboards/build-dashboards/create-dashboard-url-variables"
[Dashboard URL variables]: "/docs/grafana-cloud/ -> /docs/grafana-cloud/visualizations/dashboards/build-dashboards/create-dashboard-url-variables"
{{% /docs/reference %}}
Original file line number Diff line number Diff line change
Expand Up @@ -122,6 +122,10 @@ The same rules apply to columns by clicking the column headers.

To delete all rows, use the "select all" checkbox at the top left corner of the datagrid. This selects all rows and allows you to delete them using the context menu.

## Panel options

{{< docs/shared lookup="visualizations/panel-options.md" source="grafana" version="<GRAFANA_VERSION>" >}}

{{% docs/reference %}}
[special data sources]: "/docs/grafana/ -> /docs/grafana/<GRAFANA VERSION>/datasources#special-data-sources"
[special data sources]: "/docs/grafana-cloud/ -> /docs/grafana-cloud/connect-externally-hosted/data-sources#special-data-sources"
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,12 @@ Flame graphs let you visualize [profiling](https://grafana.com/docs/pyroscope/la

For example, if you want to understand which parts of a program consume the most resources, such as CPU time, memory, or I/O operations, you can use a flame graph to visualize and analyze where potential performance issues are:

## Panel options

{{< docs/shared lookup="visualizations/panel-options.md" source="grafana" version="<GRAFANA_VERSION>" >}}

## Flame graph mode

{{< figure src="/static/img/docs/flame-graph-panel/flame-graph-dark-mode.png" max-width="1025px" alt="A flame graph visualization for a system profile with both flame graph and top table mode." >}}

You can use a flame graph visualization if you need to:
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,10 @@ Gauges are single-value visualizations that can repeat a gauge for every series,

{{< docs/play title="Grafana Gauge Visualization" url="https://play.grafana.org/d/KIhkVD6Gk/" >}}

## Panel options

{{< docs/shared lookup="visualizations/panel-options.md" source="grafana" version="<GRAFANA_VERSION>" >}}

## Value options

Use the following options to refine how your visualization displays the value:
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -48,6 +48,10 @@ The following video provides beginner steps for creating geomap visualizations.

{{< youtube id="HwM8AFQ7EUs" >}}

## Panel options

{{< docs/shared lookup="visualizations/panel-options.md" source="grafana" version="<GRAFANA_VERSION>" >}}

## Map View

The map view controls the initial view of the map when the dashboard loads.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -60,6 +60,10 @@ The data is converted as follows:

{{< figure src="/static/img/docs/heatmap-panel/heatmap.png" max-width="1025px" alt="A heatmap visualization showing the random walk distribution over time" >}}

## Panel options

{{< docs/shared lookup="visualizations/panel-options.md" source="grafana" version="<GRAFANA_VERSION>" >}}

## Heatmap options

### Calculate from data
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -79,6 +79,10 @@ The data is converted as follows:

{{< figure src="/static/img/docs/histogram-panel/histogram-example-height-weight.png" max-width="1025px" alt="A histogram visualization showing the male height and weight distribution" >}}

## Panel options

{{< docs/shared lookup="visualizations/panel-options.md" source="grafana" version="<GRAFANA_VERSION>" >}}

## Histogram options

Use the following options to refine your histogram visualization.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -36,6 +36,10 @@ The following video provides a walkthrough of creating a logs visualization. You

{{< youtube id="jSSi_x-fD_8" >}}

## Panel options

{{< docs/shared lookup="visualizations/panel-options.md" source="grafana" version="<GRAFANA_VERSION>" >}}

## Log level

For logs where a **level** label is specified, we use the value of the label to determine the log level and update color accordingly. If the log doesn't have a level label specified, we try to find out if its content matches any of the supported expressions (see below for more information). The log level is always determined by the first match. In case Grafana is not able to determine a log level, it will be visualized with **unknown** log level. See [supported log levels and mappings of log level abbreviation and expressions][].
Expand All @@ -62,6 +66,6 @@ Use these settings to refine your visualization:
- **Order -** Display results in descending or ascending time order. The default is **Descending**, showing the newest logs first. Set to **Ascending** to show the oldest log lines first.

{{% docs/reference %}}
[supported log levels and mappings of log level abbreviation and expressions]: "/docs/grafana/ -> /docs/grafana/<GRAFANA VERSION>/explore/logs-integration#log-level"
[supported log levels and mappings of log level abbreviation and expressions]: "/docs/grafana-cloud/ -> /docs/grafana/<GRAFANA VERSION>/explore/logs-integration#log-level"
[supported log levels and mappings of log level abbreviation and expressions]: "/docs/grafana/ -> /docs/grafana/<GRAFANA_VERSION>/explore/logs-integration#log-level"
[supported log levels and mappings of log level abbreviation and expressions]: "/docs/grafana-cloud/ -> /docs/grafana/<GRAFANA_VERSION>/explore/logs-integration#log-level"
{{% /docs/reference %}}
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ title: News
weight: 100
---

## News
# News

The news visualization displays an RSS feed. By default, it displays articles from the Grafana Labs blog, and users can change this by entering a different RSS feed URL.

Expand All @@ -29,3 +29,7 @@ In version 8.5, we discontinued the "Use Proxy" option for Grafana news visualiz
If you're having trouble loading an RSS feed, you can try rehosting the feed on a different server or using a CORS proxy. A CORS proxy is a tool that allows you to bypass CORS restrictions by making requests to the RSS feed on your behalf. You can find more information about using CORS proxies online.

If you're unable to display an RSS feed using the news visualization, you can try using the community RSS/Atom data source plugin [RSS/Atom data source](https://grafana.com/grafana/plugins/volkovlabs-rss-datasource/) in combination with the Dynamic text community panel [Dynamic text](https://grafana.com/grafana/plugins/marcusolsson-dynamictext-panel/). This will allow you to display the RSS feed in a different way.

## Panel options

{{< docs/shared lookup="visualizations/panel-options.md" source="grafana" version="<GRAFANA_VERSION>" >}}
Original file line number Diff line number Diff line change
Expand Up @@ -142,3 +142,7 @@ Optional fields:
| icon | string | Name of the icon to show inside the node instead of the default stats. Only Grafana built in icons are allowed (see the available icons [here](https://developers.grafana.com/ui/latest/index.html?path=/story/docs-overview-icon--icons-overview)). |
| nodeRadius | number | Radius value in pixels. Used to manage node size. |
| highlighted | boolean | Sets whether the node should be highlighted. Useful for example to represent a specific path in the graph by highlighting several nodes and edges. Default: `false` |

## Panel options

{{< docs/shared lookup="visualizations/panel-options.md" source="grafana" version="<GRAFANA_VERSION>" >}}
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,10 @@ Pie charts display reduced series, or values in a series, from one or more queri

{{< docs/play title="Grafana Bar Charts and Pie Charts" url="https://play.grafana.org/d/ktMs4D6Mk/" >}}

## Panel options

{{< docs/shared lookup="visualizations/panel-options.md" source="grafana" version="<GRAFANA_VERSION>" >}}

## Value options

Use the following options to refine the value in your visualization.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -96,6 +96,10 @@ You can use the [**Text mode**](#text-mode) to control how the text is displayed

The panel automatically adjusts the layout depending on available width and height in the dashboard. It automatically hides the graph (sparkline) if the panel becomes too small.

## Panel options

{{< docs/shared lookup="visualizations/panel-options.md" source="grafana" version="<GRAFANA_VERSION>" >}}

## Value options

Use the following options to refine how your visualization displays its values:
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -86,6 +86,10 @@ The data is converted as follows:

If your query results aren't in a table format like the preceding examples, especially for time-series data, you can apply specific [transformations](https://stackoverflow.com/questions/68887416/grafana-state-timeline-panel-with-values-states-supplied-by-label) to achieve this.

## Panel options

{{< docs/shared lookup="visualizations/panel-options.md" source="grafana" version="<GRAFANA_VERSION>" >}}

## State timeline options

Use these options to refine the visualization.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -84,6 +84,10 @@ The data is converted as follows:

{{< figure src="/static/img/docs/status-history-panel/status_history.png" max-width="1025px" alt="A status history panel with two time columns showing the status of two servers" >}}

## Panel options

{{< docs/shared lookup="visualizations/panel-options.md" source="grafana" version="<GRAFANA_VERSION>" >}}

## Status history options

Use these options to refine the visualization.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -47,6 +47,10 @@ Click a column title to change the sort order from default to descending to asce

![Sort descending](/static/img/docs/tables/sort-descending.png 'Sort descending')

## Panel options

{{< docs/shared lookup="visualizations/panel-options.md" source="grafana" version="<GRAFANA_VERSION>" >}}

## Table options

{{% admonition type="note" %}}
Expand Down
12 changes: 8 additions & 4 deletions docs/sources/panels-visualizations/visualizations/text/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -33,6 +33,10 @@ Use a text visualization when you need to:
- Provide instructions or guidance on how to interpret different panels, configure settings, or take specific actions based on the displayed data.
- Announce any scheduled maintenance or downtime that might impact your dashboards.

## Panel options

{{< docs/shared lookup="visualizations/panel-options.md" source="grafana" version="<GRAFANA_VERSION>" >}}

## Mode

**Mode** determines how embedded content appears.
Expand Down Expand Up @@ -60,9 +64,9 @@ to the embedded text.
[Variables][] in the content will be expanded for display.

{{% docs/reference %}}
[disable_sanitize_html]: "/docs/grafana/ -> /docs/grafana/<GRAFANA VERSION>/setup-grafana/configure-grafana#disable_sanitize_html"
[disable_sanitize_html]: "/docs/grafana-cloud/ -> /docs/grafana/<GRAFANA VERSION>/setup-grafana/configure-grafana#disable_sanitize_html"
[disable_sanitize_html]: "/docs/grafana/ -> /docs/grafana/<GRAFANA_VERSION>/setup-grafana/configure-grafana#disable_sanitize_html"
[disable_sanitize_html]: "/docs/grafana-cloud/ -> /docs/grafana/<GRAFANA_VERSION>/setup-grafana/configure-grafana#disable_sanitize_html"

[Variables]: "/docs/grafana/ -> /docs/grafana/<GRAFANA VERSION>/dashboards/variables/variable-syntax"
[Variables]: "/docs/grafana-cloud/ -> /docs/grafana/<GRAFANA VERSION>/dashboards/variables/variable-syntax"
[Variables]: "/docs/grafana/ -> /docs/grafana/<GRAFANA_VERSION>/dashboards/variables/variable-syntax"
[Variables]: "/docs/grafana-cloud/ -> /docs/grafana-cloud/visualizations/dashboards/variables/variable-syntax"
{{% /docs/reference %}}
Original file line number Diff line number Diff line change
Expand Up @@ -50,6 +50,10 @@ The following video guides you through the creation steps and common customizati

{{< docs/play title="Time Series Visualizations in Grafana" url="https://play.grafana.org/d/000000016/" >}}

## Panel options

{{< docs/shared lookup="visualizations/panel-options.md" source="grafana" version="<GRAFANA_VERSION>" >}}

## Tooltip options

{{< docs/shared lookup="visualizations/tooltip-options-2.md" source="grafana" version="<GRAFANA_VERSION>" >}}
Expand Down
26 changes: 15 additions & 11 deletions docs/sources/panels-visualizations/visualizations/traces/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -116,23 +116,27 @@ You should now see a list of matching traces in the table visualization. While s

{{< figure src="/static/img/docs/panels/traces/screenshot-traces-trace-link-follow.png" caption="Follow the trace link populates the trace ID and displays the traces view" >}}

## Panel options

{{< docs/shared lookup="visualizations/panel-options.md" source="grafana" version="<GRAFANA_VERSION>" >}}

{{% docs/reference %}}
[Tracing in Explore]: "/docs/grafana/ -> /docs/grafana/<GRAFANA VERSION>/explore/trace-integration"
[Tracing in Explore]: "/docs/grafana-cloud/ -> /docs/grafana/<GRAFANA VERSION>/explore/trace-integration"
[Tracing in Explore]: "/docs/grafana/ -> /docs/grafana/<GRAFANA_VERSION>/explore/trace-integration"
[Tracing in Explore]: "/docs/grafana-cloud/ -> /docs/grafana/<GRAFANA_VERSION>/explore/trace-integration"

[Tempo data source]: "/docs/grafana/ -> /docs/grafana/<GRAFANA VERSION>/datasources/tempo"
[Tempo data source]: "/docs/grafana-cloud/ -> /docs/grafana/<GRAFANA VERSION>/datasources/tempo"
[Tempo data source]: "/docs/grafana/ -> /docs/grafana/<GRAFANA_VERSION>/datasources/tempo"
[Tempo data source]: "/docs/grafana-cloud/ -> /docs/grafana-cloud/connect-externally-hosted/data-sources/tempo"

[Panel editor documentation]: "/docs/grafana/ -> /docs/grafana/<GRAFANA VERSION>/panels-visualizations/panel-editor-overview"
[Panel editor documentation]: "/docs/grafana-cloud/ -> /docs/grafana/<GRAFANA VERSION>/panels-visualizations/panel-editor-overview"
[Panel editor documentation]: "/docs/grafana/ -> /docs/grafana/<GRAFANA_VERSION>/panels-visualizations/panel-editor-overview"
[Panel editor documentation]: "/docs/grafana-cloud/ -> /docs/grafana-cloud/visualizations/panels-visualizations/panel-editor-overview"

[Variables documentation]: "/docs/grafana/ -> /docs/grafana/<GRAFANA VERSION>/dashboards/variables"
[Variables documentation]: "/docs/grafana-cloud/ -> /docs/grafana/<GRAFANA VERSION>/dashboards/variables"
[Variables documentation]: "/docs/grafana/ -> /docs/grafana/<GRAFANA_VERSION>/dashboards/variables"
[Variables documentation]: "/docs/grafana-cloud/ -> /docs/grafana-cloud/visualizations/dashboards/variables"

[Configure panel options documentation]: "/docs/grafana/ -> /docs/grafana/<GRAFANA VERSION>/panels-visualizations/configure-panel-options"
[Configure panel options documentation]: "/docs/grafana-cloud/ -> /docs/grafana/<GRAFANA VERSION>/panels-visualizations/configure-panel-options"
[Configure panel options documentation]: "/docs/grafana/ -> /docs/grafana/<GRAFANA_VERSION>/panels-visualizations/configure-panel-options"
[Configure panel options documentation]: "/docs/grafana-cloud/ -> /docs/grafana-cloud/visualizations/panels-visualizations/configure-panel-options"

[Tempo data source]: "/docs/grafana/ -> /docs/grafana/<GRAFANA VERSION>/datasources/tempo"
[Tempo data source]: "/docs/grafana/ -> /docs/grafana/<GRAFANA_VERSION>/datasources/tempo"
[Tempo data source]: "/docs/grafana-cloud/ -> /docs/grafana-cloud/connect-externally-hosted/data-sources/tempo"

[generative AI features]: "/docs/grafana/ -> /docs/grafana/<GRAFANA_VERSION>/dashboards/manage-dashboards#set-up-generative-ai-features-for-dashboards"
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,10 @@ For example, you could represent engine power and torque versus speed where spee

{{< figure src="/media/docs/grafana/screenshot-grafana-10-0-trend-panel-new-colors.png" max-width="750px" caption="Trend engine power and torque curves" >}}

## Panel options

{{< docs/shared lookup="visualizations/panel-options.md" source="grafana" version="<GRAFANA_VERSION>" >}}

## Standard options

{{< docs/shared lookup="visualizations/standard-options.md" source="grafana" version="<GRAFANA_VERSION>" >}}
Expand Down
Loading

0 comments on commit bb77ab2

Please sign in to comment.