[v11.0.x] Docs: add bar/pie visualization Play link (#85990)

Docs: add bar/pie visualization Play link (#85898)

* Update index.md

* pie chart equivalent commit

* Updated titles to match dashboard title

---------

Co-authored-by: Isabel Matwawana <76437239+imatwawana@users.noreply.github.com>
(cherry picked from commit 623d4d580e)

Co-authored-by: David Allen <david.allen@grafana.com>

docs/sources/panels-visualizations/visualizations/bar-chart/index.md

@@ -24,6 +24,8 @@ Bar charts allow you to graph categorical data.
 
 {{< figure src="/static/img/docs/bar-chart-panel/barchart_small_example.png" max-width="1000px" caption="Bar chart" >}}
 
+{{< docs/play title="Grafana Bar Charts and Pie Charts" url="https://play.grafana.org/d/ktMs4D6Mk/" >}}
+
 ## Supported data formats
 
 Only one data frame is supported and it must have at least one string field that will be used as the category for an X or Y axis and one or more numerical fields.

docs/sources/panels-visualizations/visualizations/pie-chart/index.md

@@ -21,6 +21,8 @@ weight: 100
 
 Pie charts display reduced series, or values in a series, from one or more queries, as they relate to each other, in the form of slices of a pie. The arc length, area and central angle of a slice are all proportional to the slices value, as it relates to the sum of all values. This type of chart is best used when you want a quick comparison of a small set of values in an aesthetically pleasing form.
 
+{{< docs/play title="Grafana Bar Charts and Pie Charts" url="https://play.grafana.org/d/ktMs4D6Mk/" >}}
+
 ## Value options
 
 Use the following options to refine the value in your visualization.