Api treeMap in EJ2 TypeScript Treemap control

19 Apr 20232 minutes to read

Represents the TreeMap control.

<div id="container"/>
  var treemap = new TreeMap();


background string

Specifies the background.

border BorderModel

Specifies the border of tree map.

dataSource DataManager | TreeMapAjax | Object[]

Specifies the dataSource.

Defaults to null

description string

Description for maps.

Defaults to null

enableDrillDown boolean

To enable or disable the drillDown.

enablePersistence boolean

Enable or disable persisting component’s state between page reloads.

Defaults to false

enableRtl boolean

Enable or disable rendering component in right to left direction.

Defaults to false

equalColorValuePath string

Specifies the colorValuePath

format string

To apply internationalization for treemap

Defaults to null

height string

Specifies the height by given pixel or percentage.

Defaults to null

highlightSettings HighlightSettingsModel

To specifies the highlight settings.

initialDrillDown InitialDrillSettingsModel

Specifies the initial drillDown.

layoutType string

Specifies the rendering of layout type.

leafItemSettings LeafItemSettingsModel

Specifies to access all leaf items in levels.

legendSettings LegendSettingsModel

Specifies the legend settings.

levels LevelSettingsModel[]

Specifies the item levels.

locale string

Overrides the global culture and localization value for this component. Default global culture is ‘en-US’.

Defaults to undefined

margin MarginModel

Specifies the margin to move the render area.

palette string[]

Specifies the palette colors.

query Query

Specifies the query for filter the data.

Defaults to null

rangeColorValuePath string

Specifies the colorValuePath

selectionSettings SelectionSettingsModel

To specifies the selection settings.

tabIndex number

TabIndex value for treemap.

Defaults to 1

theme string

Specifies the theme.

titleSettings TitleSettingsModel

Specifies the title for tree map.

tooltipSettings TooltipSettingsModel

Specifies the tooltip settings.

treeMapHighlightModule TreeMapHighlight

highlightModule is used for highlight the items.

treeMapLegendModule TreeMapLegend

legendModule is used for render the legend items.

treeMapSelectionModule TreeMapSelection

selectionModule is used for select the items.

treeMapTooltipModule TreeMapTooltip

tooltipModule is used to render the treemap tooltip.

useGroupingSeparator boolean

To enable the separator

Defaults to false

weightValuePath string

Specifies the weight value path

width string

Specifies the width by given pixel or percentage.

Defaults to null



Adds the handler to the given event listener.

Returns void


Appends the control within the given HTML element

Parameter Type Description
selector (optional) string | HTMLElement Target element where control needs to be appended

Returns void


When invoked, applies the pending property changes immediately to the component.

Returns void


To destroy the treemap control.

Returns void


Handles the export method for chart control.

Returns void


Get component name

Returns string


Handles the print method for chart control.

Returns void


Applies all the pending property changes and render the component again.

Returns void


Removes the handler from the given event listener.

Returns void


To handle the window resize event on treemap.

Returns void


Dynamically injects the required modules to the component.

Returns void


beforePrint EmitType<IPrintEventArgs>

Triggers before the prints gets started.

click EmitType<IItemClickEventArgs>

Triggers the click event.

drillEnd EmitType<IDrillEndEventArgs>

Triggers the drillDown end.

drillStart EmitType<IDrillStartEventArgs>

Triggers the drillDown start.

itemClick EmitType<IItemClickEventArgs>

Triggers the item click.

itemHighlight EmitType<IItemHighlightEventArgs>

Triggers the item highlight.

itemMove EmitType<IItemMoveEventArgs>

Triggers the item move.

itemRendering EmitType<IItemRenderingEventArgs>

Triggers before item rendering.

itemSelected EmitType<IItemSelectedEventArgs>

Triggers the item selected.

load EmitType<ILoadEventArgs>

Triggers before treemap rendered.

loaded EmitType<ILoadedEventArgs>

Triggers after treemap rendered.

mouseMove EmitType<IMouseMoveEventArgs>

Triggers the mouse move event.

resize EmitType<IResizeEventArgs>

Triggers the resize event.

tooltipRendering EmitType<ITreeMapTooltipRenderEventArgs>

Triggers the tooltip rendering.