Series.Heatmap

The Chart Canvas element's Series child elements cause a data visualization (the chart) to be rendered in the canvas.

The following topics discuss the Series.Heatmap child element:

About Series.Heatmap

The Series.Heatmap element generates a Heatmap chart, sometimes called a "tree map", which uses a unique arrangement of rectangles to represent data and relationships, using color and size.

Both the color intensity (shifting within a range) and the size of the rectangles indicate relative performance, helping you to easily spot trends with a glance. This type of chart is very useful for showing hidden trends and relationships.

In the example above, the rectangle's (or cell's) size represents the average order value for each food item. The cell color also represents the average order value, ranked from red (low) to green (high). The relationship isn't linear but we can still see that items with small, red cells produced fewer orders and less revenue than items with large, green cells.

The example above is the same data but now the cell color reflects the number of orders. "Greener" cells have a higher number of orders. This allows us to compare an item's popularity (size) to its average order value (color).

As shown above, the chart is created by adding Series.Heatmap to the canvas, along with a datalayer and, typically, some child elements that may include a Group Filter, and a Group Aggregate Column element. Very few attributes need to be set for the Series element in order to produce a basic chart.

A datalayer element can be used either beneath Series.Heatmap, as shown above, or beneath Chart Canvas. If used as a child of Chart Canvas, its data is available to all child Series elements. This can improve performance if you have several series, all using the same data, beneath the same Chart Canvas element.