글꼴 등록

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

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

글꼴 등록의 기본 형식은 FontDescriptor입니다. 다음은 Roboto 글꼴을 설명하는 FontDescriptor 인스턴스의 예입니다.

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

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

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

await Core.FontStore.registerFonts(robotoFont);

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

참고

지원되는 글꼴 파일 형식은 .ttf, .otf, .woff입니다(.woff2는 Internet Explorer 11에서 지원되지 않음).
Internet Explorer 및 Edge 브라우저에서는 Document.fonts API를 지원하지 않습니다. 일부 기능은 polyfills로 얻을 수 있습니다.
글꼴 URL을 사용할 수 없는 경우 해당 글꼴이 로드되지 않습니다. 브라우저 콘솔에서 메시지를 확인해야 합니다.
생성된 @font-face CSS 규칙이 HTML 내보내기 결과에도 삽입됩니다. 그러나 source 속성의 상대 URL은 이 경우에 작동하지 않습니다. 따라서 절대 URL을 대신 사용하여 글꼴을 등록해야 합니다.
@font-face CSS는 전체 웹 페이지의 글꼴을 바꾸기 때문에 뷰어 UI 글꼴도 영향을 받을 수 있습니다.
.tte 글꼴 파일은 지원되지 않습니다.

글꼴 등록

참고

관련 항목