TreeMap

Example

Razor
<kendo-treemap>
    <hierarchical-datasource></hierarchical-datasource>
    <treemap-template></treemap-template>
</kendo-treemap>

ChildTags

Tag NameDetails
hierarchical-datasourceHierarchicalDataSourceTagHelper
treemap-templateTemplateTagHelper

Attributes

AttributeTypeDescription
nameStringSets the name of the component.
as-moduleBooleanSpecifies whether the initialization script of the component will be rendered as a JavaScript module.
is-in-client-templateBooleanWhen placing a Tag Helper within a Kendo Template, set the type to text/html and add the is-in-client-template="true" attribute.
deferredBooleanSuppress initialization script rendering. Note that this options should be used in conjunction with DeferredScripts method.
auto-bindBooleanIf set to false the widget will not bind to the data source during initialization. In this case data binding will occur when the change event of the data source is fired. By default the widget will bind to the data source specified in the configuration.
color-fieldStringThe data item field which contains the tile color.
colorsObject[]The default colors for the TreeMap items (tiles). Can be set to array of specific colors or array of color ranges. For more information on the widget behavior, see the Colors section on the TreeMap Overview page.
data-source-idStringThe Id of the data source.
on-data-boundStringThe name of the JavaScript function that will handle the dataBound event. Fired when the widget is bound to data from its dataSource.
on-item-createdStringThe name of the JavaScript function that will handle the itemCreated event. Fired when a tile has been created.
script-attributesIDictionary<String,Object>Sets the attributes that will be added to the script tag of the component's initialization script.
templateStringRepresents a collection of templates defined for the component.
template-handlerStringThe template which renders the treeMap tile content.The fields which can be used in the template are: dataItem - the original data item used to construct the point. or text - the original tile text.. This option expects the name of a JavaScript function that will be called to return the template.
template-idStringThe template which renders the treeMap tile content.The fields which can be used in the template are: dataItem - the original data item used to construct the point. or text - the original tile text.. This option expects the ID of the script element that contains the template.
template-viewIHtmlContentThe template which renders the treeMap tile content.The fields which can be used in the template are: dataItem - the original data item used to construct the point. or text - the original tile text.. This option expects the instance containing the created HTML.
text-fieldStringThe data item field which contains the tile title.
themeStringThe theme of the TreeMap.Note: Since Q2 2024 release, the default value for the theme property is "sass" instead of "default". It is recommended to use "sass" with version Q2 2024 or later.
typeTreeMapTypeThe layout type for the Treemap.
value-fieldStringThe data item field which contains the tile value.
In this article
ExampleChildTagsAttributes
Not finding the help you need?
Contact Support