A heatmap is a graphical representation of data where a metric is represented at the intersection of 2 attribute values. VitaraCharts’ custom table heatmap allows you to place multiple attributes on the columns (axis and y-axis) and at a glance display the variations in the measures. A sample table heatmap is presented below.


Metrics: The minimum 1 metric is required.

Attributes: A minimum of 2 attributes are required. The first attribute A1 is used for the x-axis and the second attribute A2 is used for the Y axis.

Use as Filter Option - Available

Thresholds Option - Available

heatmap inputs


From the 4.5 version of Vitara charts, the cell border properties are added to the heatmap chart. Border width, Border radius and Border color are the three options added in the cell border properties.

heatmap inputs

Below is the example where the applied border properties are shown Border width - 3 Border radius - 15 Border color - Sky blue

heatmap inputs


By default Heatmap creates a threshold (Gradient threshold) and plot colors based on this threshold. Below is the screenshot of threshold editor of heatmap. Threshold editor shows the default threshold applied on the chart. We can edit this threshold or delete this threshold and create a new one by clicking on ‘Add’ button.

heatmap add threshold

heatmap threshold condition

Background Image

The steps to set a background image for all Vitara charts are explained in backgroundImage.