# FBoardChart

- Human documentation: [https://docs.univer.ai/reference/facade/board-chart](https://docs.univer.ai/reference/facade/board-chart)

- Agent Markdown: [https://docs.univer.ai/reference/facade/board-chart.md](https://docs.univer.ai/reference/facade/board-chart.md)

- Requested language: `en-US`

- Content language: `en-US`

- Documentation version: `1.0.0-rc.0`

- Source: [facade/board-chart.mdx](https://github.com/dream-num/documentation/blob/dev/content/reference/facade/board-chart.mdx)

---

Live facade for an inserted Board Chart element.

Use the inherited shortcut methods to update one property immediately. Use `toBuilder()` when several
properties should be changed together, then pass the built Board Chart information to `update()`.

## Access

Access through:

* [`FBoard.insertChart()`](https://docs.univer.ai/reference/facade/board.md#insertchart)
* [`FBoard.getChart()`](https://docs.univer.ai/reference/facade/board.md#getchart)
* [`FBoard.getCharts()`](https://docs.univer.ai/reference/facade/board.md#getcharts)

## Inheritance

Extends [`FChart`](https://docs.univer.ai/reference/facade/chart.md). Its inherited members are available on this object.

## Example

```ts
const fBoard = univerAPI.getActiveBoard()
const chartInfo = fBoard
  .newChart(univerAPI.Enum.ChartTypeString.Column)
  .setSource([
    ['Quarter', 'Sales'],
    ['Q1', 120],
    ['Q2', 180],
  ])
  .setAbsolutePosition(120, 80)
  .setSize(640, 360)
  .setTitle('Quarterly sales')
  .build()
const fChart = await fBoard.insertChart(chartInfo)

fChart.setSubtitle('FY 2026').setAbsolutePosition(160, 100).setSize(720, 400)
await fChart.setDataSource([
  ['Quarter', 'Sales'],
  ['Q3', 210],
  ['Q4', 260],
])

const updatedInfo = fChart
  .toBuilder(univerAPI.Enum.ChartTypeString.Pie)
  .setTitle('Second-half sales')
  .setDoughnutHole(0.4)
  .build()
await fChart.update(updatedInfo)
```

## Setup

Register [`@univerjs-pro/boards-chart`](https://docs.univer.ai/reference/packages/plugins/univerjs-pro/boards-chart.md) or a preset that includes it. In plugin mode, import `@univerjs-pro/boards-chart/facade`. Additional methods below require their listed plugin packages. See [Facade setup](https://docs.univer.ai/guides/boards/getting-started/facade.md).

## `@univerjs-pro/boards-chart`

### `FBoardChart.chartId`

The stable Chart resource identifier.

```typescript
readonly chartId: string
```

**Package:** [`@univerjs-pro/boards-chart`](https://docs.univer.ai/reference/packages/plugins/univerjs-pro/boards-chart.md) · [Type definitions](https://unpkg.com/@univerjs-pro/boards-chart@1.0.0-rc.0/lib/types/facade/f-board-chart.d.ts)

### `FBoardChart.elementId`

The stable Board element identifier that hosts this Chart.

```typescript
readonly elementId: string
```

**Package:** [`@univerjs-pro/boards-chart`](https://docs.univer.ai/reference/packages/plugins/univerjs-pro/boards-chart.md) · [Type definitions](https://unpkg.com/@univerjs-pro/boards-chart@1.0.0-rc.0/lib/types/facade/f-board-chart.d.ts)

### `FBoardChart.getChart`

Returns the current Chart resource snapshot stored by the Board.

```typescript
getChart(): IChartResourceSnapshot | null
```

**Returns**

The Chart resource, or `null` if it no longer exists.

**Examples**

```ts
const fBoard = univerAPI.getActiveBoard()
const fChart = fBoard.getCharts()[0]
console.log(fChart?.getChart())
```

**Types:** [`IChartResourceSnapshot`](https://unpkg.com/@univerjs-pro/engine-chart@1.0.0-rc.0/lib/types/models/chart-host/resource/chart-resource-repository.d.ts)

**Package:** [`@univerjs-pro/boards-chart`](https://docs.univer.ai/reference/packages/plugins/univerjs-pro/boards-chart.md) · [Type definitions](https://unpkg.com/@univerjs-pro/boards-chart@1.0.0-rc.0/lib/types/facade/f-board-chart.d.ts)

### `FBoardChart.getDataSource`

Returns the current Chart data-source resource stored by the Board.

```typescript
getDataSource(): IChartResourceDataSource | null
```

**Returns**

The data-source resource, or `null` if it no longer exists.

**Examples**

```ts
const fBoard = univerAPI.getActiveBoard()
const fChart = fBoard.getCharts()[0]
console.log(fChart?.getDataSource())
```

**Types:** [`IChartResourceDataSource`](https://unpkg.com/@univerjs-pro/engine-chart@1.0.0-rc.0/lib/types/models/chart-host/resource/chart-resource-repository.d.ts)

**Package:** [`@univerjs-pro/boards-chart`](https://docs.univer.ai/reference/packages/plugins/univerjs-pro/boards-chart.md) · [Type definitions](https://unpkg.com/@univerjs-pro/boards-chart@1.0.0-rc.0/lib/types/facade/f-board-chart.d.ts)

### `FBoardChart.getElement`

Returns the current Board Chart element snapshot.

```typescript
getElement(): IBoardChartElement | null
```

**Returns**

The Chart element, or `null` if it no longer exists.

**Examples**

```ts
const fBoard = univerAPI.getActiveBoard()
const fChart = fBoard.getCharts()[0]
console.log(fChart?.getElement())
```

**Types:** [`IBoardChartElement`](https://unpkg.com/@univerjs-pro/boards@1.0.0-rc.0/lib/types/board.type.d.ts)

**Package:** [`@univerjs-pro/boards-chart`](https://docs.univer.ai/reference/packages/plugins/univerjs-pro/boards-chart.md) · [Type definitions](https://unpkg.com/@univerjs-pro/boards-chart@1.0.0-rc.0/lib/types/facade/f-board-chart.d.ts)

### `FBoardChart.getElementId`

Returns the stable Board element identifier that hosts this Chart.

```typescript
getElementId(): string
```

**Returns**

The Board element identifier.

**Examples**

```ts
const fBoard = univerAPI.getActiveBoard()
const fChart = fBoard.getCharts()[0]
console.log(fChart?.getElementId())
```

**Package:** [`@univerjs-pro/boards-chart`](https://docs.univer.ai/reference/packages/plugins/univerjs-pro/boards-chart.md) · [Type definitions](https://unpkg.com/@univerjs-pro/boards-chart@1.0.0-rc.0/lib/types/facade/f-board-chart.d.ts)

### `FBoardChart.unitId`

The identifier of the Board that owns this Chart.

```typescript
readonly unitId: string
```

**Package:** [`@univerjs-pro/boards-chart`](https://docs.univer.ai/reference/packages/plugins/univerjs-pro/boards-chart.md) · [Type definitions](https://unpkg.com/@univerjs-pro/boards-chart@1.0.0-rc.0/lib/types/facade/f-board-chart.d.ts)