The Blazor TreeMap is a feature-rich component used to visualize both hierarchical and flat data. Customize the look and feel of the tree maps by using built-in features like color mapping, legends, and label templates.

Key Features:

   * Leaf Nodes - A treemap contains groups of data collections. Each group has one or more leaf nodes. Each leaf node is displayed as a rectangle, sized and colored according to values that you assign
   * Levels - Render any number of child items for each individual node in the tree map.
   * Color mapping - Customize the treemap item colors based on given values. It has three types: range color mapping, equal color mapping, and desaturation color mapping.
   * Data label - It is used to display more details about a particular item.
   * Label template - Render any HTML element as a label for the nodes in the a tree map.
   * Drill-down - Support to drill the parent items to have a more detailed look at their child items.
   * Legend - To provide valuable information for interpreting the treemap with various colors, shapes, or other identifiers based on data and application needs.
   * Layout types - To view the child nodes in effective ways. Different types of layouts are Squarified, Auto slice and dice, Horizontal Slice slice and dice horizontal and Vertical slice and dice.
   * Tooltip - To display the treemap item's values in a tooltip.
   * Selection and Hightlight - Select a particular shape on mouse click and highlight on mouse hover to bring the center of attraction over other items in the treemap.
   * RTL - You can render the tree map elements like nodes, headers, labels, and legends in the right-to-left direction.
   * Print and Export - Export or print the rendered Blazor TreeMap to save a local copy for further use.

Helpful links:
Feature Tour:


This is a commercial product and requires a paid license for possession or use. Syncfusion’s licensed software, including this component, is subject to the terms and conditions of Syncfusion's EULA ( To acquire a license, you can purchase one at or start a free 30-day trial here (

© Copyright 2021 Syncfusion, Inc. All Rights Reserved. The Syncfusion Essential Studio license and copyright applies to this distribution.

Install-Package Syncfusion.Blazor.TreeMap -Version
dotnet add package Syncfusion.Blazor.TreeMap --version
<PackageReference Include="Syncfusion.Blazor.TreeMap" Version="" />
For projects that support PackageReference, copy this XML node into the project file to reference the package.
paket add Syncfusion.Blazor.TreeMap --version
The NuGet Team does not provide support for this client. Please contact its maintainers for support.
#r "nuget: Syncfusion.Blazor.TreeMap,"
#r directive can be used in F# Interactive, C# scripting and .NET Interactive. Copy this into the interactive tool or source code of the script to reference the package.
// Install Syncfusion.Blazor.TreeMap as a Cake Addin
#addin nuget:?package=Syncfusion.Blazor.TreeMap&version=

// Install Syncfusion.Blazor.TreeMap as a Cake Tool
#tool nuget:?package=Syncfusion.Blazor.TreeMap&version=
The NuGet Team does not provide support for this client. Please contact its maintainers for support.

Release Notes

NuGet packages

This package is not used by any NuGet packages.

GitHub repositories

This package is not used by any popular GitHub repositories.

Version History

Version Downloads Last updated 38 5/3/2021 80 4/26/2021 204 4/20/2021 173 4/13/2021 146 4/6/2021 1,756 3/30/2021 284 3/23/2021 104 3/16/2021 154 3/9/2021 126 3/2/2021 87 2/23/2021 124 2/15/2021 271 2/9/2021 150 2/2/2021 1,004 1/28/2021 174 1/19/2021 131 1/12/2021 272 1/4/2021 112 12/30/2020 437 12/22/2020 3,390 12/17/2020