syncfusion-aspnetcore-heatmap-chart

Implements Syncfusion HeatMap charts in ASP.NET Core Razor Pages with strongly typed bindings.

2|Updated Mar 30, 2026
One-click install
npx skills add https://github.com/syncfusion/aspnetcore-ui-components-skills --skill syncfusion-aspnetcore-heatmap-chart
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: syncfusion-aspnetcore-heatmap-chart
Source: https://github.com/syncfusion/aspnetcore-ui-components-skills/tree/main/skills/syncfusion-aspnetcore-heatmap-chart
Command: npx skills add https://github.com/syncfusion/aspnetcore-ui-components-skills --skill syncfusion-aspnetcore-heatmap-chart

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill helps you turn two-dimensional data into readable HeatMap visuals in ASP.NET Core Razor Pages, removing the guesswork from spotting trends, clusters, and outliers in dense matrices.

Core Features & Use Cases

  • HeatMap Creation: Build Syncfusion HeatMap charts with strongly typed Razor Pages bindings.
  • Flexible Data Binding: Handle array, JSON cell, table-style, remote, and strongly typed model sources.
  • Visualization Controls: Configure category, numeric, and date-time axes, legends, palettes, tooltips, selection, bubble cells, RTL layouts, and responsive rendering.
  • Use Case: A product team can map monthly sales across regions, then add gradient colors, tooltips, and selection to quickly compare performance and identify weak areas.

Quick Start

Use the syncfusion-aspnetcore-heatmap-chart skill to create a Syncfusion HeatMap in ASP.NET Core Razor Pages with your data source, axis labels, palette, legend, and tooltip settings.

Frequently Asked Questions about syncfusion-aspnetcore-heatmap-chart

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I create a HeatMap chart in ASP.NET Core Razor Pages?

To create a HeatMap chart in ASP.NET Core, configure a strongly typed PageModel with your matrix data source, then bind array, JSON, or table-style cells to the visual grid. You can define axis labels, palettes, and legends directly within the Razor Page.

Can I bind remote JSON data to a Syncfusion HeatMap in ASP.NET Core?

Yes, the HeatMap supports binding remote JSON data sources alongside array, table-style, and strongly typed model inputs. You configure the data binding settings to map matrix data to visual cells, enabling dynamic data visualization in your ASP.NET Core application.

What types of axes does the ASP.NET Core HeatMap support for matrix data?

The ASP.NET Core HeatMap supports category, numeric, and date-time axes to structure matrix data. This allows you to plot chronological data, numerical ranges, or categorical labels accurately on the X and Y axes of the chart.

How do I add bubble cells and tooltips to a HeatMap in ASP.NET Core?

You can configure bubble heat maps by enabling bubble cell rendering, and add interactive tooltips to display cell values on hover. These visualization controls are set up through the chart's configuration options in your Razor Pages.

Does the ASP.NET Core HeatMap support RTL layouts and selection events?

Yes, the HeatMap includes built-in right-to-left (RTL) layout support and cell selection capabilities. You can handle selection events and configure RTL rendering to ensure the chart meets specific dashboard interface requirements.

What is the best way to tune HeatMap performance for large datasets in ASP.NET Core?

To tune HeatMap performance for large datasets in ASP.NET Core, optimize your data binding strategy and rendering mode. Selecting the appropriate rendering mode ensures the chart handles dense matrices efficiently without degrading dashboard responsiveness.