Blazor HeatMap Chart Example - Color and Size Attributes
Source:
https://en.wikipedia.org/
This sample illustrates the number of commercial aircraft accidents and fatalities worldwide between 2012 and 2017. Each data point represents both accident count and associated fatalities, with bubble size indicating accident count and bubble shade representing fatality count.
Multi-Value Data Mapping - This example demonstrates how to map multiple data values for each data point or cell in a bubble heatmap. The bubble heatmap uses size and shade parameters to represent different data source values simultaneously, enabling comprehensive multi-dimensional data visualization.
Data Configuration - Data mapping is configured using the HeatMapBubbleDataMapping class. Specify which data source fields map to:
- Size - Controls bubble dimensions based on data values
- Color - Controls bubble shading based on data values
Legend Display - The legend is displayed only for the shade parameter of the bubble, providing a clear reference for color-to-value mapping in the visualization.
Interactive Features - The tooltip is enabled in this example. Hover the mouse over a data point or tap on touch-enabled devices to view detailed information about both the size and shade values.
More information on bubble heatmap configuration can be found in the documentation section.