# Drawing & Image

> Language fallback: requested `zh-CN`; content is `en-US`.

- Human documentation: [https://docs.univer.ai/zh-CN/reference/facade/drawing](https://docs.univer.ai/zh-CN/reference/facade/drawing)

- Agent Markdown: [https://docs.univer.ai/zh-CN/reference/facade/drawing.md](https://docs.univer.ai/zh-CN/reference/facade/drawing.md)

- Requested language: `zh-CN`

- Content language: `en-US`

- Documentation version: `1.0.0-rc.0`

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

---

| Packages | `@univerjs/sheets-drawing` |
| -------- | -------------------------- |

> This class should not be instantiated directly. Use factory methods on `univerAPI` instead.

## Overview

### @univerjs/sheets-drawing

| Method                                  | Description                                                                                                                                         |
| --------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------- |
| [`buildAsync`](#buildasync)             | Asynchronously build the image and return the image data                                                                                            |
| [`getId`](#getid)                       | Get the id of the image                                                                                                                             |
| [`getUnitId`](#getunitid)               | Get the workbook ID that owns the image                                                                                                             |
| [`getSubUnitId`](#getsubunitid)         | Get the worksheet ID that owns the image                                                                                                            |
| [`getSource`](#getsource)               | Get the source of the image                                                                                                                         |
| [`getSourceType`](#getsourcetype)       | Get the source type of the image                                                                                                                    |
| [`getType`](#gettype)                   | Get the drawing type of the image                                                                                                                   |
| [`remove`](#remove)                     | Remove the image from the sheet                                                                                                                     |
| [`setAnchorType`](#setanchortype)       | Set the anchor type of the image, whether the position and size change with the cell                                                                |
| [`setBack`](#setback)                   | Move the image layer to the bottom layer                                                                                                            |
| [`setBackward`](#setbackward)           | Move the image layer backward by one level                                                                                                          |
| [`setColumn`](#setcolumn)               | Set the horizontal position of the image                                                                                                            |
| [`setColumnOffset`](#setcolumnoffset)   | Set the horizontal offset of the image                                                                                                              |
| [`setCrop`](#setcrop)                   | Set the cropping region of the image by defining the top, bottom, left, and right edges, thereby displaying the specific part of the image you want |
| [`setCropBottom`](#setcropbottom)       | Set the cropping region of the image by defining the bottom edges, thereby displaying the specific part of the image you want                       |
| [`setCropLeft`](#setcropleft)           | Set the cropping region of the image by defining the left edges, thereby displaying the specific part of the image you want                         |
| [`setCropRight`](#setcropright)         | Set the cropping region of the image by defining the right edges, thereby displaying the specific part of the image you want                        |
| [`setCropTop`](#setcroptop)             | Set the cropping region of the image by defining the top edges, thereby displaying the specific part of the image you want                          |
| [`setForward`](#setforward)             | Move the image layer forward by one level                                                                                                           |
| [`setFront`](#setfront)                 | Move the image layer to the top layer                                                                                                               |
| [`setHeight`](#setheight)               | Set the height of the image                                                                                                                         |
| [`setImage`](#setimage)                 | Set the initial image configuration for the image builder                                                                                           |
| [`setPositionAsync`](#setpositionasync) | Asynchronously set the position of the image                                                                                                        |
| [`setRotate`](#setrotate)               | Set the rotation angle of the image                                                                                                                 |
| [`setRow`](#setrow)                     | Set the vertical position of the image                                                                                                              |
| [`setRowOffset`](#setrowoffset)         | Set the vertical offset of the image                                                                                                                |
| [`setSizeAsync`](#setsizeasync)         | Set the size of the image                                                                                                                           |
| [`setSource`](#setsource)               | Set the source URL of the image                                                                                                                     |
| [`setSubUnitId`](#setsubunitid)         | Set the sub-unit (worksheet) ID for the image                                                                                                       |
| [`setUnitId`](#setunitid)               | Set the unit (workbook) ID for the image                                                                                                            |
| [`setWidth`](#setwidth)                 | Set the width of the image                                                                                                                          |
| [`toBuilder`](#tobuilder)               | Convert the image to a FOverGridImageBuilder                                                                                                        |

## APIs

### Lifecycle & Creation

### `buildAsync`

**Signature**

```typescript
async buildAsync(): Promise<ISheetImage>
```

**Returns**

* `Promise<ISheetImage>` — See signature above.

Source: 

`@univerjs/sheets-drawing`

### Getters & Queries

### `getId`

Get the id of the image

**Signature**

```typescript
getId(): string
```

**Returns**

* `string` — The id of the image

**Examples**

```ts
const fWorkbook = univerAPI.getActiveWorkbook();
const fWorksheet = fWorkbook.getActiveSheet();
const images = fWorksheet.getImages();
images.forEach((image) => {
  console.log(image, image.getId());
});
```

Source: 

`@univerjs/sheets-drawing`

### `getUnitId`

Get the workbook ID that owns the image.

```typescript
getUnitId(): string
```

### `getSubUnitId`

Get the worksheet ID that owns the image.

```typescript
getSubUnitId(): string
```

### `getSource`

Get the source of the image

**Signature**

```typescript
getSource(): string
```

**Returns**

* `string` — The source of the image

**Examples**

```ts
const fWorkbook = univerAPI.getActiveWorkbook();
const fWorksheet = fWorkbook.getActiveSheet();
const images = fWorksheet.getImages();
images.forEach((image) => {
  console.log(image, image.toBuilder().getSource());
});
```

Source: 

`@univerjs/sheets-drawing`

### `getSourceType`

Get the source type of the image

**Signature**

```typescript
getSourceType(): ImageSourceType
```

**Returns**

* `ImageSourceType` — The source type of the image

**Examples**

```ts
const fWorkbook = univerAPI.getActiveWorkbook();
const fWorksheet = fWorkbook.getActiveSheet();
const images = fWorksheet.getImages();
images.forEach((image) => {
  console.log(image, image.toBuilder().getSourceType());
});
```

Source: 

`@univerjs/sheets-drawing`

### `getType`

Get the drawing type of the image

**Signature**

```typescript
getType(): DrawingTypeEnum
```

**Returns**

* `DrawingTypeEnum` — The drawing type of the image

**Examples**

```ts
const fWorkbook = univerAPI.getActiveWorkbook();
const fWorksheet = fWorkbook.getActiveSheet();
const images = fWorksheet.getImages();
images.forEach((image) => {
  console.log(image, image.getType());
});
```

Source: 

`@univerjs/sheets-drawing`

### Setters & Modifiers

### `setAnchorType`

Set the anchor type of the image, whether the position and size change with the cell

**Signature**

```typescript
setAnchorType(anchorType: SheetDrawingAnchorType): FOverGridImageBuilder
```

**Parameters**

* `anchorType` `SheetDrawingAnchorType` — *No description*

**Returns**

* `FOverGridImageBuilder` — The `FOverGridImageBuilder` for chaining

**Examples**

```ts
const fWorkbook = univerAPI.getActiveWorkbook();
const fWorksheet = fWorkbook.getActiveSheet();

// image1 position is start from A6 cell, anchor type is Position.
// Only the position of the drawing follows the cell changes. When rows or columns are inserted or deleted, the position of the drawing changes, but the size remains the same.
const image1 = await fWorksheet.newOverGridImage()
  .setSource('https://avatars.githubusercontent.com/u/61444807?s=48&v=4', univerAPI.Enum.ImageSourceType.URL)
  .setColumn(0)
  .setRow(5)
  .setAnchorType(univerAPI.Enum.SheetDrawingAnchorType.Position)
  .buildAsync();

// image2 position is start from C6 cell, anchor type is Both.
// The size and position of the drawing follow the cell changes. When rows or columns are inserted or deleted, the size and position of the drawing change accordingly.
const image2 = await fWorksheet.newOverGridImage()
  .setSource('https://avatars.githubusercontent.com/u/61444807?s=48&v=4', univerAPI.Enum.ImageSourceType.URL)
  .setColumn(2)
  .setRow(5)
  .setAnchorType(univerAPI.Enum.SheetDrawingAnchorType.Both)
  .buildAsync();

// image3 position is start from E6 cell, anchor type is None.
// The size and position of the drawing do not follow the cell changes. When rows or columns are inserted or deleted, the position and size of the drawing remain unchanged.
const image3 = await fWorksheet.newOverGridImage()
  .setSource('https://avatars.githubusercontent.com/u/61444807?s=48&v=4', univerAPI.Enum.ImageSourceType.URL)
  .setColumn(4)
  .setRow(5)
  .setAnchorType(univerAPI.Enum.SheetDrawingAnchorType.None)
  .buildAsync();

// insert images into the sheet
fWorksheet.insertImages([image1, image2, image3]);

// after 2 seconds, set the row height of the 5th row to 100px and insert a row before the 5th row.
// then observe the position and size changes of the images.
setTimeout(() => {
  fWorksheet.setRowHeight(5, 100).insertRowBefore(5);
}, 2000);
```

Source: 

`@univerjs/sheets-drawing`

### `setBack`

Move the image layer to the bottom layer

**Signature**

```typescript
setBack(): boolean
```

**Returns**

* `boolean` — true if the image is moved to the bottom layer successfully, otherwise false

**Examples**

```ts
const fWorkbook = univerAPI.getActiveWorkbook();
const fWorksheet = fWorkbook.getActiveSheet();
const image = fWorksheet.getImages()[0];
const result = image?.setBack();
console.log(result);
```

Source: 

`@univerjs/sheets-drawing`

### `setBackward`

Move the image layer backward by one level

**Signature**

```typescript
setBackward(): boolean
```

**Returns**

* `boolean` — true if the image is moved backward successfully, otherwise false

**Examples**

```ts
const fWorkbook = univerAPI.getActiveWorkbook();
const fWorksheet = fWorkbook.getActiveSheet();
const image = fWorksheet.getImages()[0];
const result = image?.setBackward();
console.log(result);
```

Source: 

`@univerjs/sheets-drawing`

### `setColumn`

Set the horizontal position of the image

**Signature**

```typescript
setColumn(column: number): FOverGridImageBuilder
```

**Parameters**

* `column` `number` — *No description*

**Returns**

* `FOverGridImageBuilder` — The `FOverGridImageBuilder` for chaining

**Examples**

```ts
// create a new image builder and set image source.
// then build `ISheetImage` and insert it into the sheet, position is start from F6 cell.
const fWorkbook = univerAPI.getActiveWorkbook();
const fWorksheet = fWorkbook.getActiveSheet();
const image = await fWorksheet.newOverGridImage()
  .setSource('https://avatars.githubusercontent.com/u/61444807?s=48&v=4', univerAPI.Enum.ImageSourceType.URL)
  .setColumn(5)
  .setRow(5)
  .buildAsync();
fWorksheet.insertImages([image]);
```

Source: 

`@univerjs/sheets-drawing`

### `setColumnOffset`

Set the horizontal offset of the image

**Signature**

```typescript
setColumnOffset(offset: number): FOverGridImageBuilder
```

**Parameters**

* `offset` `number` — *No description*

**Returns**

* `FOverGridImageBuilder` — The `FOverGridImageBuilder` for chaining

**Examples**

```ts
// create a new image builder and set image source.
// then build `ISheetImage` and insert it into the sheet, position is start from F6 cell and horizontal offset is 10px.
const fWorkbook = univerAPI.getActiveWorkbook();
const fWorksheet = fWorkbook.getActiveSheet();
const image = await fWorksheet.newOverGridImage()
  .setSource('https://avatars.githubusercontent.com/u/61444807?s=48&v=4', univerAPI.Enum.ImageSourceType.URL)
  .setColumn(5)
  .setRow(5)
  .setColumnOffset(10)
  .buildAsync();
fWorksheet.insertImages([image]);
```

Source: 

`@univerjs/sheets-drawing`

### `setCrop`

Set the cropping region of the image by defining the top, bottom, left, and right edges, thereby displaying the specific part of the image you want.

**Signature**

```typescript
setCrop(top?: number, left?: number, bottom?: number, right?: number): boolean
```

**Parameters**

* `top` `number` *(optional)* — *No description*
* `left` `number` *(optional)* — *No description*
* `bottom` `number` *(optional)* — *No description*
* `right` `number` *(optional)* — *No description*

**Returns**

* `boolean` — true if the crop is set successfully, otherwise false

**Examples**

```ts
// set the crop of the image, top 10px, left 10px, bottom 10px, right 10px.
const fWorkbook = univerAPI.getActiveWorkbook();
const fWorksheet = fWorkbook.getActiveSheet();
const image = fWorksheet.getImages()[0];
const result = image?.setCrop(10, 10, 10, 10);
console.log(result);
```

Source: 

`@univerjs/sheets-drawing`

### `setCropBottom`

Set the cropping region of the image by defining the bottom edges, thereby displaying the specific part of the image you want.

**Signature**

```typescript
setCropBottom(bottom: number): FOverGridImageBuilder
```

**Parameters**

* `bottom` `number` — *No description*

**Returns**

* `FOverGridImageBuilder` — The `FOverGridImageBuilder` for chaining

**Examples**

```ts
// create a new image builder and set image source.
// then build `ISheetImage` and insert it into the sheet, position is start from F6 cell, bottom crop is 10px.
const fWorkbook = univerAPI.getActiveWorkbook();
const fWorksheet = fWorkbook.getActiveSheet();
const image = await fWorksheet.newOverGridImage()
  .setSource('https://avatars.githubusercontent.com/u/61444807?s=48&v=4', univerAPI.Enum.ImageSourceType.URL)
  .setColumn(5)
  .setRow(5)
  .setCropBottom(10)
  .buildAsync();
fWorksheet.insertImages([image]);
```

Source: 

`@univerjs/sheets-drawing`

### `setCropLeft`

Set the cropping region of the image by defining the left edges, thereby displaying the specific part of the image you want.

**Signature**

```typescript
setCropLeft(left: number): FOverGridImageBuilder
```

**Parameters**

* `left` `number` — *No description*

**Returns**

* `FOverGridImageBuilder` — The `FOverGridImageBuilder` for chaining

**Examples**

```ts
// create a new image builder and set image source.
// then build `ISheetImage` and insert it into the sheet, position is start from F6 cell, left crop is 10px.
const fWorkbook = univerAPI.getActiveWorkbook();
const fWorksheet = fWorkbook.getActiveSheet();
const image = await fWorksheet.newOverGridImage()
  .setSource('https://avatars.githubusercontent.com/u/61444807?s=48&v=4', univerAPI.Enum.ImageSourceType.URL)
  .setColumn(5)
  .setRow(5)
  .setCropLeft(10)
  .buildAsync();
fWorksheet.insertImages([image]);
```

Source: 

`@univerjs/sheets-drawing`

### `setCropRight`

Set the cropping region of the image by defining the right edges, thereby displaying the specific part of the image you want.

**Signature**

```typescript
setCropRight(right: number): FOverGridImageBuilder
```

**Parameters**

* `right` `number` — *No description*

**Returns**

* `FOverGridImageBuilder` — The `FOverGridImageBuilder` for chaining

**Examples**

```ts
// create a new image builder and set image source.
// then build `ISheetImage` and insert it into the sheet, position is start from F6 cell, right crop is 10px.
const fWorkbook = univerAPI.getActiveWorkbook();
const fWorksheet = fWorkbook.getActiveSheet();
const image = await fWorksheet.newOverGridImage()
  .setSource('https://avatars.githubusercontent.com/u/61444807?s=48&v=4', univerAPI.Enum.ImageSourceType.URL)
  .setColumn(5)
  .setRow(5)
  .setCropRight(10)
  .buildAsync();
fWorksheet.insertImages([image]);
```

Source: 

`@univerjs/sheets-drawing`

### `setCropTop`

Set the cropping region of the image by defining the top edges, thereby displaying the specific part of the image you want.

**Signature**

```typescript
setCropTop(top: number): FOverGridImageBuilder
```

**Parameters**

* `top` `number` — *No description*

**Returns**

* `FOverGridImageBuilder` — The `FOverGridImageBuilder` for chaining

**Examples**

```ts
// create a new image builder and set image source.
// then build `ISheetImage` and insert it into the sheet, position is start from F6 cell, top crop is 10px.
const fWorkbook = univerAPI.getActiveWorkbook();
const fWorksheet = fWorkbook.getActiveSheet();
const image = await fWorksheet.newOverGridImage()
  .setSource('https://avatars.githubusercontent.com/u/61444807?s=48&v=4', univerAPI.Enum.ImageSourceType.URL)
  .setColumn(5)
  .setRow(5)
  .setCropTop(10)
  .buildAsync();
fWorksheet.insertImages([image]);
```

Source: 

`@univerjs/sheets-drawing`

### `setForward`

Move the image layer forward by one level

**Signature**

```typescript
setForward(): boolean
```

**Returns**

* `boolean` — true if the image is moved forward successfully, otherwise false

**Examples**

```ts
const fWorkbook = univerAPI.getActiveWorkbook();
const fWorksheet = fWorkbook.getActiveSheet();
const image = fWorksheet.getImages()[0];
const result = image?.setForward();
console.log(result);
```

Source: 

`@univerjs/sheets-drawing`

### `setFront`

Move the image layer to the top layer

**Signature**

```typescript
setFront(): boolean
```

**Returns**

* `boolean` — true if the image is moved to the top layer successfully, otherwise false

**Examples**

```ts
const fWorkbook = univerAPI.getActiveWorkbook();
const fWorksheet = fWorkbook.getActiveSheet();
const image = fWorksheet.getImages()[0];
const result = image?.setFront();
console.log(result);
```

Source: 

`@univerjs/sheets-drawing`

### `setHeight`

Set the height of the image

**Signature**

```typescript
setHeight(height: number): FOverGridImageBuilder
```

**Parameters**

* `height` `number` — *No description*

**Returns**

* `FOverGridImageBuilder` — The `FOverGridImageBuilder` for chaining

**Examples**

```ts
// create a new image builder and set image source.
// then build `ISheetImage` and insert it into the sheet, position is start from F6 cell, width is 120px and height is 50px.
const fWorkbook = univerAPI.getActiveWorkbook();
const fWorksheet = fWorkbook.getActiveSheet();
const image = await fWorksheet.newOverGridImage()
  .setSource('https://avatars.githubusercontent.com/u/61444807?s=48&v=4', univerAPI.Enum.ImageSourceType.URL)
  .setColumn(5)
  .setRow(5)
  .setWidth(120)
  .setHeight(50)
  .buildAsync();
fWorksheet.insertImages([image]);
```

Source: 

`@univerjs/sheets-drawing`

### `setImage`

Set the initial image configuration for the image builder.

**Signature**

```typescript
setImage(image: ISheetImage): FOverGridImageBuilder
```

**Parameters**

* `image` `ISheetImage` — *No description*

**Returns**

* `FOverGridImageBuilder` — The `FOverGridImageBuilder` for chaining

**Examples**

```ts
// create a new image builder and set initial image configuration.
// then build `ISheetImage` and insert it into the sheet, position is start from F6 cell.
const fWorkbook = univerAPI.getActiveWorkbook();
const fWorksheet = fWorkbook.getActiveSheet();
const image = await fWorksheet.newOverGridImage()
  .setImage({
    drawingId: '123456',
    drawingType: univerAPI.Enum.DrawingType.DRAWING_IMAGE,
    imageSourceType: univerAPI.Enum.ImageSourceType.BASE64,
    source: 'https://avatars.githubusercontent.com/u/61444807?s=48&v=4',
    unitId: fWorkbook.getId(),
    subUnitId: fWorksheet.getSheetId(),
  })
  .setColumn(5)
  .setRow(5)
  .buildAsync();
fWorksheet.insertImages([image]);
```

Source: 

`@univerjs/sheets-drawing`

### `setPositionAsync`

**Signature**

```typescript
async setPositionAsync(row: number, column: number, rowOffset?: number, columnOffset?: number): Promise<boolean>
```

**Parameters**

* `row` `number` — *No description*
* `column` `number` — *No description*
* `rowOffset` `number` *(optional)* — *No description*
* `columnOffset` `number` *(optional)* — *No description*

**Returns**

* `Promise<boolean>` — See signature above.

Source: 

`@univerjs/sheets-drawing`

### `setRotate`

Set the rotation angle of the image

**Signature**

```typescript
setRotate(angle: number): boolean
```

**Parameters**

* `angle` `number` — *No description*

**Returns**

* `boolean` — true if the rotation is set successfully, otherwise false

**Examples**

```ts
// set 90 degrees rotation of the image
const fWorkbook = univerAPI.getActiveWorkbook();
const fWorksheet = fWorkbook.getActiveSheet();
const image = fWorksheet.getImages()[0];
const result = image?.setRotate(90);
console.log(result);
```

Source: 

`@univerjs/sheets-drawing`

### `setRow`

Set the vertical position of the image

**Signature**

```typescript
setRow(row: number): FOverGridImageBuilder
```

**Parameters**

* `row` `number` — *No description*

**Returns**

* `FOverGridImageBuilder` — The `FOverGridImageBuilder` for chaining

**Examples**

```ts
// create a new image builder and set image source.
// then build `ISheetImage` and insert it into the sheet, position is start from F6 cell.
const fWorkbook = univerAPI.getActiveWorkbook();
const fWorksheet = fWorkbook.getActiveSheet();
const image = await fWorksheet.newOverGridImage()
  .setSource('https://avatars.githubusercontent.com/u/61444807?s=48&v=4', univerAPI.Enum.ImageSourceType.URL)
  .setColumn(5)
  .setRow(5)
  .buildAsync();
fWorksheet.insertImages([image]);
```

Source: 

`@univerjs/sheets-drawing`

### `setRowOffset`

Set the vertical offset of the image

**Signature**

```typescript
setRowOffset(offset: number): FOverGridImageBuilder
```

**Parameters**

* `offset` `number` — *No description*

**Returns**

* `FOverGridImageBuilder` — The `FOverGridImageBuilder` for chaining

**Examples**

```ts
// create a new image builder and set image source.
// then build `ISheetImage` and insert it into the sheet, position is start from F6 cell and vertical offset is 10px.
const fWorkbook = univerAPI.getActiveWorkbook();
const fWorksheet = fWorkbook.getActiveSheet();
const image = await fWorksheet.newOverGridImage()
  .setSource('https://avatars.githubusercontent.com/u/61444807?s=48&v=4', univerAPI.Enum.ImageSourceType.URL)
  .setColumn(5)
  .setRow(5)
  .setRowOffset(10)
  .buildAsync();
fWorksheet.insertImages([image]);
```

Source: 

`@univerjs/sheets-drawing`

### `setSizeAsync`

Set the size of the image

**Signature**

```typescript
async setSizeAsync(width: number, height: number): Promise<boolean>
```

**Parameters**

* `width` `number` — *No description*
* `height` `number` — *No description*

**Returns**

* `Promise<boolean>` — true if the size is set successfully, otherwise false

**Examples**

```ts
// set the image width 120px and height 50px
const fWorkbook = univerAPI.getActiveWorkbook();
const fWorksheet = fWorkbook.getActiveSheet();
const image = fWorksheet.getImages()[0];
const result = image?.setSizeAsync(120, 50);
console.log(result);
```

Source: 

`@univerjs/sheets-drawing`

### `setSource`

**Signature**

```typescript
setSource(source: string, sourceType?: ImageSourceType): boolean
```

**Parameters**

* `source` `string` — *No description*
* `sourceType` `ImageSourceType` *(optional)* — *No description*

**Returns**

* `boolean` — See signature above.

Source: 

`@univerjs/sheets-drawing`

### `setSubUnitId`

**Signature**

```typescript
setSubUnitId(subUnitId: string): FOverGridImageBuilder
```

**Parameters**

* `subUnitId` `string` — *No description*

**Returns**

* `FOverGridImageBuilder` — See signature above.

Source: 

`@univerjs/sheets-drawing`

### `setUnitId`

**Signature**

```typescript
setUnitId(unitId: string): FOverGridImageBuilder
```

**Parameters**

* `unitId` `string` — *No description*

**Returns**

* `FOverGridImageBuilder` — See signature above.

Source: 

`@univerjs/sheets-drawing`

### `setWidth`

Set the width of the image

**Signature**

```typescript
setWidth(width: number): FOverGridImageBuilder
```

**Parameters**

* `width` `number` — *No description*

**Returns**

* `FOverGridImageBuilder` — The `FOverGridImageBuilder` for chaining

**Examples**

```ts
// create a new image builder and set image source.
// then build `ISheetImage` and insert it into the sheet, position is start from F6 cell, width is 120px and height is 50px.
const fWorkbook = univerAPI.getActiveWorkbook();
const fWorksheet = fWorkbook.getActiveSheet();
const image = await fWorksheet.newOverGridImage()
  .setSource('https://avatars.githubusercontent.com/u/61444807?s=48&v=4', univerAPI.Enum.ImageSourceType.URL)
  .setColumn(5)
  .setRow(5)
  .setWidth(120)
  .setHeight(50)
  .buildAsync();
fWorksheet.insertImages([image]);
```

Source: 

`@univerjs/sheets-drawing`

### Actions & Operations

### `remove`

Remove the image from the sheet

**Signature**

```typescript
remove(): boolean
```

**Returns**

* `boolean` — true if the image is removed successfully, otherwise false

**Examples**

```ts
const fWorkbook = univerAPI.getActiveWorkbook();
const fWorksheet = fWorkbook.getActiveSheet();
const image = fWorksheet.getImages()[0];
const result = image?.remove();
console.log(result);
```

Source: 

`@univerjs/sheets-drawing`

### Miscellaneous

### `toBuilder`

Convert the image to a FOverGridImageBuilder

**Signature**

```typescript
toBuilder(): FOverGridImageBuilder
```

**Returns**

* `FOverGridImageBuilder` — The builder FOverGridImageBuilder

**Examples**

```ts
const fWorkbook = univerAPI.getActiveWorkbook();
const fWorksheet = fWorkbook.getActiveSheet();
const images = fWorksheet.getImages();
images.forEach((image) => {
  console.log(image, image.toBuilder().getSource());
});
```

Source: 

`@univerjs/sheets-drawing`