# 이미지와 구분선

> 관리 이미지 삽입, 이미지 리소스 업데이트 및 PDF 페이지에 벡터 구분선을 추가합니다.

- Human documentation: [https://docs.univer.ai/ko-KR/guides/pdfs/features/core/images-and-dividers](https://docs.univer.ai/ko-KR/guides/pdfs/features/core/images-and-dividers)

- Agent Markdown: [https://docs.univer.ai/ko-KR/guides/pdfs/features/core/images-and-dividers.md](https://docs.univer.ai/ko-KR/guides/pdfs/features/core/images-and-dividers.md)

- Requested language: `ko-KR`

- Content language: `ko-KR`

- Documentation version: `1.0.4`

- Source: [pdfs/features/core/images-and-dividers.ko-KR.mdx](https://github.com/dream-num/documentation/blob/dev/content/guides/pdfs/features/core/images-and-dividers.ko-KR.mdx)

---

PDF 이미지는 관리되는 편집 가능 리소스입니다. URL, UUID, base64 문자열 또는 blob 소스에는 `insertImageAsync()`를 사용하고 단계별 삽입에는 분리된 빌더를 사용하세요.

## 이미지 삽입

```ts
const image = await page.insertImageAsync(
  'https://example.com/assets/signature.png',
  {
    left: 36,
    top: 36,
    width: 144,
    height: 72,
    opacity: 0.9,
  }
)

image.setRotation(-4).bringToFront()
```

자동 소스 감지는 절대 `http` 및 `https` URL만 URL로 인식합니다. 상대 URL 경로는 URL 소스로 허용되지 않으므로 절대 URL, 유효한 관리 리소스 UUID 또는 base64 데이터를 사용하세요.

## 이미지 빌더 사용

```ts
const imageInfo = page
  .newImage()
  .setSource('https://example.com/assets/chart.png')
  .setAbsolutePosition(216, 36)
  .setSize(240, 135)
  .setOpacity(0.85)
  .build()

const chart = page.insertImage(imageInfo)
```

`build()`는 분리된 작업이며 PDF를 수정하지 않습니다. 결과를 `insertImage()`에 전달하세요. 기존 관리 이미지는 live 소스, 변환, 자르기 및 불투명도 메서드로 업데이트하세요.

## 구분선 추가

```ts
const divider = page.insertDivider({
  left: 36,
  top: 144,
  width: 420,
  strokeWidth: 1,
})

divider.setStroke({
  width: 2,
  color: '#3366ff',
})
```

구분선 기하 정보와 선 길이는 PDF 포인트를 사용합니다. `getStroke()`는 분리된 스냅샷을 반환하며 `setStroke()`는 기하 정보를 바꾸지 않고 선을 교체합니다.

`FPdfImage`는 `getSource()`, `getImageSourceType()`, `setSource()`, `getCrop()`, `setCrop()`, `getOpacity()`, `setOpacity()`, `remove()`도 제공합니다. 이미지 불투명도는 `0`부터 `1` 사이여야 합니다.