Merge branch 'tr-embed-grafana-image-docs' into 'master'

Documentation for embedding Grafana live charts as images

Closes #66662

See merge request gitlab-org/gitlab-ce!32342

doc/user/project/integrations/prometheus.md

@@ -393,6 +393,27 @@ The following requirements must be met for the metric to unfurl:
 ![Embedded Metrics](img/embed_metrics.png)
+### Embedding live Grafana charts
+
+It is also possible to embed live [Grafana](https://docs.gitlab.com/omnibus/settings/grafana.html) charts within issues, as a [Direct Linked Rendered Image](https://grafana.com/docs/reference/sharing/#direct-link-rendered-image).
+
+The sharing dialog within Grafana provides the link, as highlighted below.
+
+![Grafana Direct Linked Rendered Image](img/grafana_live_embed.png)
+
+NOTE: **Note:**
+For this embed to display correctly the Grafana instance must be available to the target user, either as a public dashboard or on the same network.
+
+Copy the link and add an image tag as [inline HTML](../../markdown.md#inline-html) in your markdown. You may tweak the query parameters as required. For instance, removing the `&from=` and `&to=` parameters will give you a live chart. Here is example markup for a live chart from GitLab's public dashboard:
+
+```html
+<img src="https://dashboards.gitlab.com/render/d-solo/RZmbBr7mk/gitlab-triage?orgId=1&refresh=30s&var-env=gprd&var-environment=gprd&var-prometheus=prometheus-01-inf-gprd&var-prometheus_app=prometheus-app-01-inf-gprd&var-backend=All&var-type=All&var-stage=main&panelId=1247&width=1000&height=300"/>
+```
+
+This will render like so:
+
+<img src="https://dashboards.gitlab.com/render/d-solo/RZmbBr7mk/gitlab-triage?orgId=1&refresh=30s&var-env=gprd&var-environment=gprd&var-prometheus=prometheus-01-inf-gprd&var-prometheus_app=prometheus-app-01-inf-gprd&var-backend=All&var-type=All&var-stage=main&panelId=1247&width=1000&height=300"/>
+
 ## Troubleshooting
 If the "No data found" screen continues to appear, it could be due to: