HeatMap Chart / Features / Color Range

Blazor HeatMap Chart Example - Custom Color Range Definition

Loading Syncfusion Blazor Server Demos…

Properties

This sample visualizes the energy consumption in trillion British Thermal Units (BTU) by various public sectors of the US government over the years. The property panel provides options to change the palette type using radio buttons for dynamic color scheme adjustment.

Color Range Configuration - This example explains how to define specific color ranges within the Heatmap component for precise data-to-color mapping:

  • Use the StartValue and EndValue properties to define the range of start and end values in your data source
  • Use the MinColor and MaxColor properties to specify the colors for the defined range

Legend Management - The legend is enabled in this example to represent the color ranges visually. When the palette mode is changed, the legend type automatically switches between Gradient and List type, providing appropriate visual representation for the selected palette.

Transform your Blazor web apps today with Syncfusion® Blazor components
145+ high-performance and responsive UI components
Dedicated support
Hassle-free licensing
TRY IT FOR FREE