diff --git a/docs/sources/panels-visualizations/visualizations/canvas/index.md b/docs/sources/panels-visualizations/visualizations/canvas/index.md index 162639163a9..106b7d03d3d 100644 --- a/docs/sources/panels-visualizations/visualizations/canvas/index.md +++ b/docs/sources/panels-visualizations/visualizations/canvas/index.md @@ -127,7 +127,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](https://grafana.com/docs/grafana/latest/panels-visualizations/configure-data-links/), but only for metric-value, text, rectangle, and ellipse 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. diff --git a/public/app/features/canvas/elements/ellipse.tsx b/public/app/features/canvas/elements/ellipse.tsx index 2cac9ba1de4..c16b1cf057c 100644 --- a/public/app/features/canvas/elements/ellipse.tsx +++ b/public/app/features/canvas/elements/ellipse.tsx @@ -6,6 +6,7 @@ import { config } from 'app/core/config'; import { DimensionContext } from 'app/features/dimensions/context'; import { ColorDimensionEditor } from 'app/features/dimensions/editors/ColorDimensionEditor'; import { TextDimensionEditor } from 'app/features/dimensions/editors/TextDimensionEditor'; +import { getDataLinks } from 'app/plugins/panel/canvas/utils'; import { CanvasElementItem, CanvasElementProps, defaultBgColor, defaultTextColor } from '../element'; import { Align, VAlign, EllipseConfig, EllipseData } from '../types'; @@ -98,6 +99,8 @@ export const ellipseItem: CanvasElementItem = { data.color = ctx.getColor(cfg.color).value(); } + data.links = getDataLinks(ctx, cfg, data.text); + return data; }, diff --git a/public/app/features/canvas/elements/rectangle.tsx b/public/app/features/canvas/elements/rectangle.tsx index 4f0f515dc1a..c91e86dcf17 100644 --- a/public/app/features/canvas/elements/rectangle.tsx +++ b/public/app/features/canvas/elements/rectangle.tsx @@ -7,6 +7,7 @@ import { config } from 'app/core/config'; import { DimensionContext } from 'app/features/dimensions/context'; import { ColorDimensionEditor } from 'app/features/dimensions/editors/ColorDimensionEditor'; import { TextDimensionEditor } from 'app/features/dimensions/editors/TextDimensionEditor'; +import { getDataLinks } from 'app/plugins/panel/canvas/utils'; import { CanvasElementItem, CanvasElementProps, defaultBgColor, defaultTextColor } from '../element'; import { Align, TextConfig, TextData, VAlign } from '../types'; @@ -81,6 +82,8 @@ export const rectangleItem: CanvasElementItem = { data.color = ctx.getColor(cfg.color).value(); } + data.links = getDataLinks(ctx, cfg, data.text); + return data; },