Transformations changes (#27690)

* Chunking out the long Transformation topic. Also, updated TOC. Local build looks fine.

* More changes.

* More re-arranging of content. Fixed links in Types and Options page.

* Capitalization changes.

* Changes to Overview section.

* Fixed merge conflicts.

* Fixed typo to fix build failure.

* Update docs/sources/panels/transformations/types-options.md

Co-authored-by: Diana Payton <52059945+oddlittlebird@users.noreply.github.com>

* Changes from Diana.

* Fixed a typo in a relref.

* Fixed broken link.

* Update link in Troubleshooting topic.

Co-authored-by: Diana Payton <52059945+oddlittlebird@users.noreply.github.com>

docs/sources/guides/whats-new-in-v7-0.md

@@ -60,9 +60,9 @@ In the future we will add more workflows and integrations so that correlating be
 
 
 The data you want to visualize can come from many different places and it is usually not in exactly the right form. Users can now transform non-time series data into tables (e.g., JSON files or even simple lookup tables) in seconds without any customization or additional overhead. They can then combine non-time series data with any other data in Grafana; data from an external database or a panel that already exists in one of their current dashboards.
 The data you want to visualize can come from many different places and it is usually not in exactly the right form. Users can now transform non-time series data into tables (e.g., JSON files or even simple lookup tables) in seconds without any customization or additional overhead. They can then combine non-time series data with any other data in Grafana; data from an external database or a panel that already exists in one of their current dashboards.
 
 
-By chaining a simple set of point and click [transformations]({{< relref "../panels/transformations.md" >}}), users will be able join, pivot, filter, re-name and do calculations to get the results they need. Perfect for operations across queries or data sources missing essential data transformations.
+By chaining a simple set of point and click [transformations]({{< relref "../panels/transformations/_index.md" >}}), users will be able join, pivot, filter, re-name and do calculations to get the results they need. Perfect for operations across queries or data sources missing essential data transformations.
 
 
-[Transformations]({{< relref "../panels/transformations.md" >}}) also adds the ability to do maths across queries. Lots of data sources do not support this natively so being able to do it in Grafana is a powerful feature.
+[Transformations]({{< relref "../panels/transformations/_index.md" >}}) also adds the ability to do maths across queries. Lots of data sources do not support this natively, so being able to do it in Grafana is a powerful feature.
 
 
 For users with large dashboards or with heavy queries, being able to reuse the query result from one panel in another panel can be a huge performance gain for slow queries (e.g log or sql queries). From the data source menu in the query editor, you can choose the `--dashboard--` option and then choose the query result from another panel on the same dashboard.
 For users with large dashboards or with heavy queries, being able to reuse the query result from one panel in another panel can be a huge performance gain for slow queries (e.g log or sql queries). From the data source menu in the query editor, you can choose the `--dashboard--` option and then choose the query result from another panel on the same dashboard.
 
 
@@ -80,7 +80,7 @@ We are also introducing a new shared data model for both time series and table d
 - **Outer join:** Joins many time series/tables by a field. This can be used to outer join multiple time series on the _time_ field to show many time series in one table.
 - **Outer join:** Joins many time series/tables by a field. This can be used to outer join multiple time series on the _time_ field to show many time series in one table.
 - **Add field from calculation:** This is a powerful transformation that allows you perform many different types of math operations and add the result as a new field. Can be used to calculate the difference between two series or fields and add the result to a new field. Or multiply one field with another another and add the result to a new field.
 - **Add field from calculation:** This is a powerful transformation that allows you perform many different types of math operations and add the result as a new field. Can be used to calculate the difference between two series or fields and add the result to a new field. Or multiply one field with another another and add the result to a new field.
 
 
-Learn more about this feature in [Transformations]({{< relref "../panels/transformations.md" >}}).
+Learn more about this feature in [Transformations]({{< relref "../panels/transformations/_index.md" >}}).
 
 
 ## Field options and overrides
 ## Field options and overrides
 
 

docs/sources/guides/whats-new-in-v7-2.md

@@ -79,8 +79,8 @@ The [Field options]({{< relref "../panels/field-options.md" >}}) content has bee
 
 
 Grafana 7.2 includes the following transformation enhancements:
 Grafana 7.2 includes the following transformation enhancements:
 
 
-- A new [Group By]({{< relref "../panels/transformations.md#group-by">}}) transformation that allows you to group by multiple fields and add any number of aggregations for other fields.
-- The [Labels to fields]({{< relref "../panels/transformations.md#labels-to-fields">}}) transformation now allows you to pick one label and use that as the name of the value field.
+- A new [Group By]({{< relref "../panels/transformations/types-options.md#group-by">}}) transformation that allows you to group by multiple fields and add any number of aggregations for other fields.
+- The [Labels to fields]({{< relref "../panels/transformations/types-options.md#labels-to-fields">}}) transformation now allows you to pick one label and use that as the name of the value field.
 - You can drag transformations to reorder them. Remember that transformations are processed in the order they are listed in the UI, so think before you move something!
 - You can drag transformations to reorder them. Remember that transformations are processed in the order they are listed in the UI, so think before you move something!
 
 
 {{< docs-imagebox img="/img/docs/v72/transformations.gif" max-width="800px" caption="Group by and reordering of transformations" >}}
 {{< docs-imagebox img="/img/docs/v72/transformations.gif" max-width="800px" caption="Group by and reordering of transformations" >}}

docs/sources/menu.yaml

@@ -165,6 +165,13 @@
       name: Queries
       name: Queries
     - link: /panels/transformations/
     - link: /panels/transformations/
       name: Transformations
       name: Transformations
+      children:
+        - link: /panels/transformations/
+          name: Overview
+        - link: /panels/transformations/apply-transformations/
+          name: Apply transformations
+        - link: /panels/transformations/types-options/
+          name: Transformation types and options
     - link: /panels/field-options/
     - link: /panels/field-options/
       name: Field options
       name: Field options
     - link: /panels/panel-editor/
     - link: /panels/panel-editor/

docs/sources/panels/add-a-panel.md

@@ -58,7 +58,7 @@ Our Grafana Fundamentals tutorial is a great place to start, or you can learn mo
 
 
 - Learn more about [panel editor]({{< relref "panel-editor.md" >}}) options.
 - Learn more about [panel editor]({{< relref "panel-editor.md" >}}) options.
 - Add more [queries]({{< relref "queries.md" >}}).
 - Add more [queries]({{< relref "queries.md" >}}).
-- [Transform]({{< relref "transformations.md" >}}) your data.
+- [Transform]({{< relref "transformations/_index.md" >}}) your data.
 - [Configure]({{< relref "field-options.md" >}}) how your results are displayed in the visualization.
 - [Configure]({{< relref "field-options.md" >}}) how your results are displayed in the visualization.
 - If you made a graph panel, set up an [alert]({{< relref "../alerting/alerts-overview.md" >}}).
 - If you made a graph panel, set up an [alert]({{< relref "../alerting/alerts-overview.md" >}}).
 - Create [templates and variables]({{< relref "../variables/templates-and-variables.md" >}}).
 - Create [templates and variables]({{< relref "../variables/templates-and-variables.md" >}}).

docs/sources/panels/panel-editor.md

@@ -61,7 +61,7 @@ The section contains tabs where you enter queries, transform your data, and crea
 {{< docs-imagebox img="/img/docs/panel-editor/data-section-7-0.png" class="docs-image--no-shadow" max-width="1200px" >}}
 {{< docs-imagebox img="/img/docs/panel-editor/data-section-7-0.png" class="docs-image--no-shadow" max-width="1200px" >}}
 
 
 - **Query tab -** Select your data source and enter queries here. For more information, refer to [Queries]({{< relref "queries.md" >}}).
 - **Query tab -** Select your data source and enter queries here. For more information, refer to [Queries]({{< relref "queries.md" >}}).
-- **Transform tab -** Apply data transformations. For more information, refer to [Transformations]({{< relref "transformations.md" >}}).
+- **Transform tab -** Apply data transformations. For more information, refer to [Transformations]({{< relref "transformations/_index.md" >}}).
 - **Alert tab -** Write alert rules. For more information, refer to [Create alerts]({{< relref "../alerting/create-alerts.md" >}}).
 - **Alert tab -** Write alert rules. For more information, refer to [Create alerts]({{< relref "../alerting/create-alerts.md" >}}).
 
 
 ### Panel and field options (side pane)
 ### Panel and field options (side pane)

docs/sources/panels/transformations/_index.md

++++
+title = "Overview"
+type = "docs"
+[menu.docs]
+identifier = "overview"
+parent = "transformations"
+weight = 300
++++
+
+# Transformations overview
+
+Transformations process the result set of a query before it’s passed on for visualization. They allow you to rename fields, join separate time series together, do math across queries, and more. For users, with numerous dashboards or with a large volume of queries, the ability to reuse the query result from one panel in another panel can be a huge performance gain.
+
+The transformations feature is accessible from the **Transform** tab of the Grafana panel editor.
+
+> **Note:** Transformations is a Grafana 7.0 beta feature. Topics in this section will be frequently updated as we work on this feature.
+
+Transformations sometimes result in data that cannot be graphed. When that happens, Grafana displays a suggestion on the visualization that you can click to switch to table visualization. This often helps you better understand what the transformation is doing to your data.
+
+## Order of transformations
+
+In case there are multiple transformations, Grafana applies them in the exact sequence in which they are listed. Each transformation creates a new result set that is passed onto the next transformation in the pipeline for processing.
+
+The order in which transformations are applied can make a huge difference in how your results look. For example, if you use a Reduce transformation to condense all the results of one column into a single value, then you can only apply transformations to that single value.
+
+## Prerequisites
+
+Before you can configure and apply transformations:
+
+- You must have entered a query and returned data from a data source. For more information on queries, refer to [Queries]({{< relref "../queries.md" >}}).
+  
+- You must have applied a visualization that supports queries. Examples are:
+  - [Bar gauge]({{< relref "../visualizations/bar-gauge-panel.md" >}})
+  - [Gauge]({{< relref "../visualizations/gauge-panel.md" >}})
+  - [Graph]({{< relref "../visualizations/graph-panel.md" >}})
+  - [Heatmap]({{< relref "../visualizations/heatmap.md" >}})
+  - [Logs]({{< relref "../visualizations/logs-panel.md" >}})
+  - [Stat]({{< relref "../visualizations/stat-panel.md" >}})
+  - [Table]({{< relref "../visualizations/table-panel.md" >}})
\ No newline at end of file

docs/sources/panels/transformations/apply-transformations.md

++++
+title = "Apply a transformation"
+type = "docs"
+[menu.docs]
+identifier = "apply-transformation"
+parent = "transformations"
+weight = 300
++++
+
+
+# Apply transformations
+
+You can apply transformations from the Transform tab of the Grafana panel editor, which is located next to the Queries tab. See also, [Debug  transformations](#debug-transformations).
+
+To apply a transformation:
+
+1. Navigate to the panel where you want to add one or more transformations.
+1. Click the panel title and then click **Edit**.
+1. Click the **Transform** tab.
+1. Click a transformation to select it.
+
+   A transformation row displays. You can configure the transformation options here. For more information, refer to [Transformation types and options]({{< relref "types-options.md" >}}).
+
+1. Click **Add transformation** to apply another transformation.
+
+   This next transformation acts on the result set returned by the previous transformation.
+
+   {{< docs-imagebox img="/img/docs/transformations/transformations-7-0.png" class="docs-image--no-shadow" max-width= "1100px" >}}
+
+## Delete a transformation
+
+To remove a transformation that is no longer needed, click the trash can icon.
+
+## Debug transformations 
+To see the input and the output result sets of the transformation, click the bug icon on the right side of the transformation row
+Grafana displays the transformation debug view below the transformation row.
+{{< docs-imagebox img="/img/docs/transformations/debug-transformations-7-0.png" class="docs-image--no-shadow" max-width= "1100px" >}}

docs/sources/panels/transformations/prereq.md

++++
+title = "Prerequisites"
+type = "docs"
+[menu.docs]
+identifier = "transformations_prerequisites"
+parent = "transformations"
+weight = 300
++++
+
+# Prerequisites
+
+Before you can configure and apply transformations:
+
+- You must have entered a query and returned data from a data source. For more information on queries, refer to [Queries]({{< relref "../queries.md" >}}).
+  
+- You must have applied a visualization that supports queries. Examples are:
+  - [Bar gauge]({{< relref "../visualizations/bar-gauge-panel.md" >}})
+  - [Gauge]({{< relref "../visualizations/gauge-panel.md" >}})
+  - [Graph]({{< relref "../visualizations/graph-panel.md" >}})
+  - [Heatmap]({{< relref "../visualizations/heatmap.md" >}})
+  - [Logs]({{< relref "../visualizations/logs-panel.md" >}})
+  - [Stat]({{< relref "../visualizations/stat-panel.md" >}})
+  - [Table]({{< relref "../visualizations/table-panel.md" >}})

docs/sources/panels/visualizations/bar-gauge-panel.md

@@ -19,7 +19,7 @@ This panel can show one or more bar gauges depending on how many series, rows, o
 
 
 Bar gauge visualizations allow you to apply:
 Bar gauge visualizations allow you to apply:
 
 
-- [Data transformations]({{< relref "../transformations.md" >}})
+- [Data transformations]({{< relref "../transformations/prereq.md" >}})
 - [Field options and overrides]({{< relref "../field-options.md" >}})
 - [Field options and overrides]({{< relref "../field-options.md" >}})
 - [Thresholds]({{< relref "../thresholds.md" >}})
 - [Thresholds]({{< relref "../thresholds.md" >}})
 
 

docs/sources/panels/visualizations/gauge-panel.md

@@ -17,7 +17,7 @@ Gauge is a single value panel that can repeat a gauge for every series, column o
 
 
 Gauge visualizations allow you to apply:
 Gauge visualizations allow you to apply:
 
 
-- [Data transformations]({{< relref "../transformations.md" >}})
+- [Data transformations]({{< relref "../transformations/prereq.md" >}})
 - [Field options and overrides]({{< relref "../field-options.md" >}})
 - [Field options and overrides]({{< relref "../field-options.md" >}})
 - [Thresholds]({{< relref "../thresholds.md" >}})
 - [Thresholds]({{< relref "../thresholds.md" >}})
 
 

docs/sources/panels/visualizations/graph-panel.md

@@ -15,7 +15,7 @@ This visualization is the most-used in the Grafana ecosystem. It can render as a
 ## Data and field options
 ## Data and field options
 
 
 Graph visualizations allow you to apply:
 Graph visualizations allow you to apply:
-- [Data transformations]({{< relref "../transformations.md" >}})
+- [Data transformations]({{< relref "../transformations/prereq.md" >}})
 - [Alerts]({{< relref "../../alerting/alerts-overview.md" >}}) - This is the only type of visualization that allows you to set alerts.
 - [Alerts]({{< relref "../../alerting/alerts-overview.md" >}}) - This is the only type of visualization that allows you to set alerts.
 - [Thresholds]({{< relref "../thresholds.md" >}})
 - [Thresholds]({{< relref "../thresholds.md" >}})
 
 

docs/sources/panels/visualizations/stat-panel.md

@@ -19,7 +19,7 @@ The Stat panel shows a one large stat value with an optional graph sparkline. Yo
 
 
 Stat visualizations allow you to apply:
 Stat visualizations allow you to apply:
 
 
-- [Data transformations]({{< relref "../transformations.md" >}})
+- [Data transformations]({{< relref "../transformations/prereq.md" >}})
 - [Field options and overrides]({{< relref "../field-options.md" >}})
 - [Field options and overrides]({{< relref "../field-options.md" >}})
 - [Thresholds]({{< relref "../thresholds.md" >}})
 - [Thresholds]({{< relref "../thresholds.md" >}})
 
 

docs/sources/panels/visualizations/table-panel.md

@@ -21,7 +21,7 @@ The table panel is very flexible, supporting multiple modes for time series and
 
 
 Table visualizations allow you to apply:
 Table visualizations allow you to apply:
 
 
-- [Data transformations]({{< relref "../transformations.md" >}})
+- [Data transformations]({{< relref "../transformations/prereq.md" >}})
 - [Field options and overrides]({{< relref "../field-options.md" >}})
 - [Field options and overrides]({{< relref "../field-options.md" >}})
 - [Thresholds]({{< relref "../thresholds.md" >}})
 - [Thresholds]({{< relref "../thresholds.md" >}})
 
 

docs/sources/troubleshooting/_index.md

@@ -23,7 +23,7 @@ For more information, refer to [Enable debug logging in Grafana CLI]({{< relref
 
 
 Order of transformations matters. If the final data output from multiple transformations looks wrong, try changing the transformation order. Each transformation transforms data returned by the previous transformation, not the original raw data.
 Order of transformations matters. If the final data output from multiple transformations looks wrong, try changing the transformation order. Each transformation transforms data returned by the previous transformation, not the original raw data.
 
 
-For more information, refer to [Debug transformations]({{< relref "../panels/transformations.md#debug-transformations" >}}).
+For more information, refer to [Debug transformations]({{< relref "../panels/transformations/apply-transformations.md" >}}).
 
 
 ## Text missing with server-side image rendering (RPM-based Linux)
 ## Text missing with server-side image rendering (RPM-based Linux)