API 参考

FChordChartBuilder

本 API 页面目前提供英文正文。代码签名与标识符不随界面语言变化。

Fluent semantic builder for an undirected Source/Target/optional-Value edge list.

Final display labels own node identity. Duplicate and reverse rows aggregate, omitted Value means unit-weight counts, and blank endpoints, self-links, and non-positive/non-finite mapped weights are skipped without coercion. Aggregate values are formatted after summing. Defaults are renderer-owned and require the native ECharts 6.1 Chord series; no renderer nodes, links, or layout are persisted.

Inheritance

Extends FChartBuilderBase. Its inherited members are available on this object.

Example

Sheet

TypeScript
const fWorkbook = univerAPI.getActiveWorkbook()const fWorksheet = fWorkbook.getSheetByName('Sheet1')const chartInfo = fWorksheet  .newChart(univerAPI.Enum.ChartTypeString.Chord)  .setSource('A1:C8')  .setChordMapping({ sourceIndex: 0, targetIndex: 1, valueIndex: 2 })  .setChordLayout({ startAngle: 90, clockwise: true, innerRadiusRatio: 0.4, outerRadiusRatio: 0.8 })  .setChordNode({ color: '#2563eb', opacity: 0.8 })  .setChordLabel({    visible: true,    position: univerAPI.Enum.ChartChordLabelPosition.Outside,    color: '#334155',  })  .setChordRibbon({ color: univerAPI.Enum.ChartChordRibbonColorMode.Gradient, opacity: 0.6 })  .setChordEmphasis({ focus: univerAPI.Enum.ChartChordFocusMode.Adjacency })  .build()await fWorksheet.insertChart(chartInfo)

Doc

TypeScript
const fDocument = univerAPI.getActiveDocument()const chartInfo = fDocument  .newChart(univerAPI.Enum.ChartTypeString.Chord)  .setSource([    ['Source', 'Target', 'Value'],    ['A', 'B', 5],    ['A', 'C', 3],    ['B', 'C', 2],  ])  .setChordMapping({ sourceIndex: 0, targetIndex: 1, valueIndex: 2 })  .setChordLayout({ startAngle: 90, clockwise: true, innerRadiusRatio: 0.4, outerRadiusRatio: 0.8 })  .setChordNode({ color: '#2563eb', opacity: 0.8 })  .setChordLabel({    visible: true,    position: univerAPI.Enum.ChartChordLabelPosition.Outside,    color: '#334155',  })  .setChordRibbon({ color: univerAPI.Enum.ChartChordRibbonColorMode.Gradient, opacity: 0.6 })  .setChordEmphasis({ focus: univerAPI.Enum.ChartChordFocusMode.Adjacency })  .build()await fDocument.insertChart(chartInfo)

Slide

TypeScript
const fPresentation = univerAPI.getActivePresentation()const fSlide = fPresentation.getSlideByIndex(0)const chartInfo = fSlide  .newChart(univerAPI.Enum.ChartTypeString.Chord)  .setSource([    ['Source', 'Target', 'Value'],    ['A', 'B', 5],    ['A', 'C', 3],    ['B', 'C', 2],  ])  .setChordMapping({ sourceIndex: 0, targetIndex: 1, valueIndex: 2 })  .setChordLayout({ startAngle: 90, clockwise: true, innerRadiusRatio: 0.4, outerRadiusRatio: 0.8 })  .setChordNode({ color: '#2563eb', opacity: 0.8 })  .setChordLabel({    visible: true,    position: univerAPI.Enum.ChartChordLabelPosition.Outside,    color: '#334155',  })  .setChordRibbon({ color: univerAPI.Enum.ChartChordRibbonColorMode.Gradient, opacity: 0.6 })  .setChordEmphasis({ focus: univerAPI.Enum.ChartChordFocusMode.Adjacency })  .build()await fSlide.insertChart(chartInfo)

Board

TypeScript
const fBoard = univerAPI.getActiveBoard()const chartInfo = fBoard  .newChart(univerAPI.Enum.ChartTypeString.Chord)  .setSource([    ['Source', 'Target', 'Value'],    ['A', 'B', 5],    ['A', 'C', 3],    ['B', 'C', 2],  ])  .setChordMapping({ sourceIndex: 0, targetIndex: 1, valueIndex: 2 })  .setChordLayout({ startAngle: 90, clockwise: true, innerRadiusRatio: 0.4, outerRadiusRatio: 0.8 })  .setChordNode({ color: '#2563eb', opacity: 0.8 })  .setChordLabel({    visible: true,    position: univerAPI.Enum.ChartChordLabelPosition.Outside,    color: '#334155',  })  .setChordRibbon({ color: univerAPI.Enum.ChartChordRibbonColorMode.Gradient, opacity: 0.6 })  .setChordEmphasis({ focus: univerAPI.Enum.ChartChordFocusMode.Adjacency })  .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

FChordChartBuilder.resetChordEmphasis

Resets Chord emphasis behavior to renderer defaults.

TypeScript
resetChordEmphasis(): this

Returns

This builder for chaining.

Examples

TypeScript
builder.resetChordEmphasis()

Package: @univerjs-pro/engine-chart · Type definitions

FChordChartBuilder.resetChordLabel

Resets Chord labels to renderer defaults.

TypeScript
resetChordLabel(): this

Returns

This builder for chaining.

Examples

TypeScript
builder.resetChordLabel()

Package: @univerjs-pro/engine-chart · Type definitions

FChordChartBuilder.resetChordLayout

Resets the Chord layout to renderer defaults.

TypeScript
resetChordLayout(): this

Returns

This builder for chaining.

Examples

TypeScript
builder.resetChordLayout()

Package: @univerjs-pro/engine-chart · Type definitions

FChordChartBuilder.resetChordNode

Resets Chord node styling to renderer defaults.

TypeScript
resetChordNode(): this

Returns

This builder for chaining.

Examples

TypeScript
builder.resetChordNode()

Package: @univerjs-pro/engine-chart · Type definitions

FChordChartBuilder.resetChordRibbon

Resets Chord ribbon styling to renderer defaults.

TypeScript
resetChordRibbon(): this

Returns

This builder for chaining.

Examples

TypeScript
builder.resetChordRibbon()

Package: @univerjs-pro/engine-chart · Type definitions

FChordChartBuilder.setChordEmphasis

Sets hover emphasis and focus behavior.

TypeScript
setChordEmphasis(value: IChartChordEmphasisSpec): this

Parameters

  • value — Required. Chord emphasis settings.

Returns

This builder for chaining.

Examples

TypeScript
builder.setChordEmphasis({ focus: univerAPI.Enum.ChartChordFocusMode.Adjacency })

Types: IChartChordEmphasisSpec

Package: @univerjs-pro/engine-chart · Type definitions

FChordChartBuilder.setChordLabel

Sets Chord node-label visibility, position, and styling.

TypeScript
setChordLabel(value: IChartChordLabelSpec): this

Parameters

  • value — Required. Chord label settings.

Returns

This builder for chaining.

Examples

TypeScript
builder.setChordLabel({  visible: true,  position: univerAPI.Enum.ChartChordLabelPosition.Outside,  color: '#334155',})

Types: IChartChordLabelSpec

Package: @univerjs-pro/engine-chart · Type definitions

FChordChartBuilder.setChordLayout

Sets the Chord radius, rotation, and spacing layout.

TypeScript
setChordLayout(value: IChartChordLayoutSpec): this

Parameters

  • value — Required. Chord layout settings.

Returns

This builder for chaining.

Examples

TypeScript
builder.setChordLayout({ startAngle: 90, clockwise: true })

Types: IChartChordLayoutSpec

Package: @univerjs-pro/engine-chart · Type definitions

FChordChartBuilder.setChordMapping

Sets the Source, Target, and optional Value field indexes for Chord edges.

TypeScript
setChordMapping(value: IChartChordMappingSpec): this

Parameters

  • value — Required. Zero-based field indexes for each edge component.

Returns

This builder for chaining.

Examples

TypeScript
builder.setChordMapping({ sourceIndex: 0, targetIndex: 1, valueIndex: 2 })

Types: IChartChordMappingSpec

Package: @univerjs-pro/engine-chart · Type definitions

FChordChartBuilder.setChordNode

Sets Chart-wide Chord node styling.

TypeScript
setChordNode(value: IChartChordNodeStyleSpec): this

Parameters

  • value — Required. Chord node appearance settings.

Returns

This builder for chaining.

Examples

TypeScript
builder.setChordNode({ color: '#2563eb', opacity: 0.8 })

Types: IChartChordNodeStyleSpec

Package: @univerjs-pro/engine-chart · Type definitions

FChordChartBuilder.setChordRibbon

Sets Chord ribbon color, opacity, and border styling.

TypeScript
setChordRibbon(value: IChartChordRibbonStyleSpec): this

Parameters

  • value — Required. Chord ribbon appearance settings.

Returns

This builder for chaining.

Examples

TypeScript
builder.setChordRibbon({  color: univerAPI.Enum.ChartChordRibbonColorMode.Gradient,  opacity: 0.6,})

Types: IChartChordRibbonStyleSpec

Package: @univerjs-pro/engine-chart · Type definitions

你觉得这篇文档如何？

© 2026 DreamNum Co., Ltd.