# 글꼴 등록

## Content



ActiveReportsJS는 클라이언트 측에서 보고서를 실행하고 내보내며 인쇄합니다. 즉, 코드가 다양한 플랫폼, 환경, 브라우저에서 실행됩니다. 보고서에서 텍스트 서식 지정에 비표준 글꼴(예: [google 글꼴](https://fonts.google.com/) 중 하나)을 사용하는 경우 보고서를 실행하고 내보내거나 인쇄하는 일부 환경에서는 이 글꼴을 사용하지 못할 가능성이 높습니다.

ActiveReportsJS에서는 이 문제의 발생 가능성을 줄이기 위해 응용 프로그램 내에서 사용되는, 보고서에 글꼴을 등록하는 API를 제공합니다. 

글꼴 등록의 기본 형식은 [FontDescriptor](@api/interfaces/core.fontdescriptor.html)입니다. 다음은 [Roboto 글꼴](https://fonts.google.com/specimen/Roboto)을 설명하는 FontDescriptor 인스턴스의 예입니다.

```js
const robotoFont = {
  name: "Roboto",
  source:
    "https://fonts.gstatic.com/s/roboto/v20/KFOkCnqEu92Fr1MmgVxIIzI.woff2",
};

```

```FontStore``` 개체의 ```registerFont``` 메서드는 글꼴 설명자 개체를 수락하고 지정된 글꼴을 등록합니다. 예를 들어 다음과 같습니다.

```js
import { Core } from "@grapecity/activereports";

await Core.FontStore.registerFonts(robotoFont);
```

이 코드는 사용자 정의 글꼴을 사용하는 보고서를 미리 보거나 내보내거나 인쇄하기 전에 실행해야 합니다.

### 참고

* 지원되는 글꼴 파일 형식은 .ttf, .otf, .woff입니다(.woff2는 Internet Explorer 11에서 지원되지 않음).

* Internet Explorer 및 Edge 브라우저에서는 [Document.fonts](https://developer.mozilla.org/en-US/docs/Web/API/Document/fonts) API를 지원하지 않습니다. 일부 기능은 [polyfills](https://github.com/bramstein/fontfaceobserver)로 얻을 수 있습니다.

* 글꼴 URL을 사용할 수 없는 경우 해당 글꼴이 로드되지 않습니다. 브라우저 콘솔에서 메시지를 확인해야 합니다.

* 생성된 @font-face CSS 규칙이 HTML 내보내기 결과에도 삽입됩니다. 그러나 `source` 속성의 상대 URL은 이 경우에 작동하지 않습니다. 따라서 절대 URL을 대신 사용하여 글꼴을 등록해야 합니다.

* @font-face CSS는 전체 웹 페이지의 글꼴을 바꾸기 때문에 뷰어 UI 글꼴도 영향을 받을 수 있습니다.

* .tte 글꼴 파일은 지원되지 않습니다.

### 관련 항목
* [내보내기](/activereportsjs/docs/v2.2/DeveloperGuide/ActiveReportsJSViewer/Export)
* [인쇄](/activereportsjs/docs/v2.2/DeveloperGuide/ActiveReportsJSViewer/Print)