Heat Map Chart

Description:

Heat Map Chart

The Heat map chart component that uses colors to represent data values in a table. Add color range component to it to define the colors. You can plot data like employee attendance records, a periodic table, tracking investments in the stock market, comparing the performance of different companies, etc

Allowed Parent Components:

1. Card Body

2. Col

3. Grid Child

4. Horizontal Section

5. Vertical Section

Allowed Child Components:

1. Color Range

2. Popover

3. Pulse

4. Trigger Before Render

5. Trigger On Click

Properties

➤ Caption

Provide a title for the Chart.

Allowed Values: An expression which should return string after evaluation

➤ Sub Caption

Provide a sub title for the chart.

Allowed Values: An expression which should return string after evaluation

➤ X Axis Name

Provide a name that you would want to display on the X-axis.

Allowed Values: Free text field

➤ Y Axis Name

Provide a name that you would want to display on the Y-axis.

Allowed Values: Free text field

➤ Height

Provide numerical values to set heigth in pixels.

Allowed Values: Any number value

➤ Width

Provide numerical values to set width in pixels.

Allowed Values: Any number value

➤ Min Value

Provide a minimum value that can be plotted on the chart

Allowed Values: Any number value

➤ On Click

Allowed Values: Controller Function

➤ Use Existing Data Source

Choose this prop if you want to reuse a Data Source that was defined on some other component on this page or any of the parent abstract pages.

Allowed Values: Yes/No

➤ Data Source

Select a datasource from the list.

Allowed Values: Select a datasource from the list.

➤ Data Source Alias

Allowed Values: Free text field

➤ Default Where Clause

Allowed Values: Free text field

➤ Max Rows

Allowed Values: Any number value

➤ Order By Clause

e.g. #firstAttr#, #secondAttr# DESC

Allowed Values: Free text field

➤ Auto Query

Check this property to query the selected datasource on component render.

Allowed Values: Yes/No

➤ Execute Count SQL

Check this to execute count SQL to get the total number of rows in the database on a query. You can get this value by using the expression: #{DataStore.totalLength}

Allowed Values: Yes/No

➤ Execute Distinct SQL

Check this to execute distinct SQL to get the total number of distinct rows in the database on a query.

Allowed Values: Yes/No

➤ X Axis Value Attribute

It is a column through which you can get the data from DataSource to display along X-axis.

Allowed Values: It is a column through which you can get the data from DataSource to display along X-axis.

➤ Y Axis Value Attribute

It is a column through which you can get the data from DataSource to display along Y-axis.

Allowed Values: It is a column through which you can get the data from DataSource to display along Y-axis.

➤ Value Attribute

The attribute that contains the value to fill in the chart

Allowed Values: The attribute that contains the value to fill in the chart

➤ Function

Select a function to do arithmetic operations on data.

Allowed Values:

1. SUM

2. COUNT

3. AVG

4. MAX

5. MIN

6. COUNT(DISTINCT)

➤ Auto Refresh Interval

Specify this property in seconds to refresh the component to specified interval.

Allowed Values: Any number value

➤ Show Plot Border

Check this property to show border to the plots.

Allowed Values: Yes/No

➤ Show Values

Check this property to show values on the chart.

Allowed Values: Yes/No

➤ Show Border

Check this property to show border to the chart.

Allowed Values: Yes/No

➤ Show Shadow

Check this property to show shadow to the chart.

Allowed Values: Yes/No

➤ Gradient

Check this property to display gradient legend.

Allowed Values: Yes/No

➤ Color Code

Provide a hex code to avoid default colors and when color range is not provided.

Allowed Values: Free text field

➤ Hide No Data Placeholder

Check this to hide the data displayed when no data found.

Allowed Values: Yes/No

➤ No Data Icon

Select an icon to display when no data found.

Allowed Values: Icon List

➤ No Data Text1

Provide a text to display as title when no data found.

Allowed Values: Free text field

➤ No Data Text2

Provide a text to display as sub title when no data found.

Allowed Values: Free text field