FTreemapChartBuilder
Fluent semantic builder for an automatically laid-out Treemap.
Field indexes are zero-based in the orientation-normalized dataset. Rendering needs at least one ordered hierarchy field and exactly one value field. Duplicate complete paths sum finite numeric values; blank, textual, non-finite, and final non-positive values do not render. Parent-owned facts add to child totals. Layout is automatic and navigation is disabled. The runtime defaults are banner parent labels and visible category-name leaf labels; labels may hide when their rectangle cannot fit the complete content.
Inheritance
Extends FChartBuilderBase. Its inherited members are available on this object.
Example
Sheet
const fWorkbook = univerAPI.getActiveWorkbook()const fWorksheet = fWorkbook.getSheetByName('Sheet1')const chartInfo = fWorksheet .newChart(univerAPI.Enum.ChartTypeString.Treemap) .setSource('A1:D8') .setHierarchyFields([0, 1, 2]) .setValueField(3) .setParentLabelLayout(univerAPI.Enum.ChartTreemapParentLabelLayout.Banner) .setTreemapLabel({ visible: true, color: '#334155' }) .build()await fWorksheet.insertChart(chartInfo)Doc
const fDocument = univerAPI.getActiveDocument()const chartInfo = fDocument .newChart(univerAPI.Enum.ChartTypeString.Treemap) .setSource([ ['Region', 'Country', 'City', 'Sales'], ['Europe', 'France', 'Paris', 120], ['Asia', 'Japan', 'Tokyo', 180], ]) .setHierarchyFields([0, 1, 2]) .setValueField(3) .setParentLabelLayout(univerAPI.Enum.ChartTreemapParentLabelLayout.Banner) .setTreemapLabel({ visible: true, color: '#334155' }) .build()await fDocument.insertChart(chartInfo)Slide
const fPresentation = univerAPI.getActivePresentation()const fSlide = fPresentation.getSlideByIndex(0)const chartInfo = fSlide .newChart(univerAPI.Enum.ChartTypeString.Treemap) .setSource([ ['Region', 'Country', 'City', 'Sales'], ['Europe', 'France', 'Paris', 120], ['Asia', 'Japan', 'Tokyo', 180], ]) .setHierarchyFields([0, 1, 2]) .setValueField(3) .setParentLabelLayout(univerAPI.Enum.ChartTreemapParentLabelLayout.Banner) .setTreemapLabel({ visible: true, color: '#334155' }) .build()await fSlide.insertChart(chartInfo)Board
const fBoard = univerAPI.getActiveBoard()const chartInfo = fBoard .newChart(univerAPI.Enum.ChartTypeString.Treemap) .setSource([ ['Region', 'Country', 'City', 'Sales'], ['Europe', 'France', 'Paris', 120], ['Asia', 'Japan', 'Tokyo', 180], ]) .setHierarchyFields([0, 1, 2]) .setValueField(3) .setParentLabelLayout(univerAPI.Enum.ChartTreemapParentLabelLayout.Banner) .setTreemapLabel({ visible: true, color: '#334155' }) .build()await fBoard.insertChart(chartInfo)Setup
Register @univerjs-pro/engine-chart or a preset that includes it. In plugin mode, import @univerjs-pro/engine-chart/facade. Additional methods below require their listed plugin packages. See Facade setup.
@univerjs-pro/engine-chart
FTreemapChartBuilder.resetParentLabelLayout
Removes the explicit parent layout and restores the runtime banner default.
resetParentLabelLayout(): thisReturns
This builder for chaining.
Examples
builder.resetParentLabelLayout()Package: @univerjs-pro/engine-chart · Type definitions
FTreemapChartBuilder.resetTreemapLabel
Removes explicit leaf-label style and restores visible category-name labels.
resetTreemapLabel(): thisReturns
This builder for chaining.
Examples
builder.resetTreemapLabel()Package: @univerjs-pro/engine-chart · Type definitions
FTreemapChartBuilder.setHierarchyFields
Replaces the ordered root-to-leaf hierarchy with zero-based field indexes.
setHierarchyFields(indexes: readonly number[]): thisParameters
indexes— Required. Ordered hierarchy field indexes.
Returns
This builder for chaining.
Examples
builder.setHierarchyFields([0, 1, 2])Package: @univerjs-pro/engine-chart · Type definitions
FTreemapChartBuilder.setParentLabelLayout
Sets parent names to a reserved banner, overlapping text, or hidden.
setParentLabelLayout(layout: TreemapParentLabelLayout): thisParameters
layout— Required. Parent-label layout mode.
Returns
This builder for chaining.
Examples
builder.setParentLabelLayout(univerAPI.Enum.ChartTreemapParentLabelLayout.Banner)Types: TreemapParentLabelLayout
Package: @univerjs-pro/engine-chart · Type definitions
FTreemapChartBuilder.setTreemapLabel
Sets leaf visibility, content, and font appearance.
setTreemapLabel(label: DeepNullish<IChartTreemapLabelSpec>): thisParameters
label— Required. Treemap leaf-label settings.
Returns
This builder for chaining.
Examples
builder.setTreemapLabel({ visible: true, color: '#334155' })Types: DeepNullish · IChartTreemapLabelSpec
Package: @univerjs-pro/engine-chart · Type definitions
FTreemapChartBuilder.setValueField
Replaces the sole numeric value field with a zero-based field index.
setValueField(index: number): thisParameters
index— Required. Numeric value field index.
Returns
This builder for chaining.
Examples
builder.setValueField(3)Package: @univerjs-pro/engine-chart · Type definitions
How is this guide?