>  기사  >  웹 프론트엔드  >  FabricJS를 사용하여 텍스트에서 단일 문자의 기준선을 이동하는 방법은 무엇입니까?

FabricJS를 사용하여 텍스트에서 단일 문자의 기준선을 이동하는 방법은 무엇입니까?

PHPz
PHPz앞으로
2023-09-01 17:05:031363검색

如何使用 FabricJS 移动文本中单个字符的基线?

이 튜토리얼에서는 FabricJS를 사용하여 텍스트에서 단일 문자의 기준선을 이동하는 방법을 알아봅니다. Fabric.Text 인스턴스를 추가하여 캔버스에 텍스트를 표시할 수 있습니다. 텍스트의 크기를 이동, 크기 조정 및 변경할 수 있을 뿐만 아니라 각각 textAlign, underline 및 lineHeight 속성을 통해 사용할 수 있는 텍스트 정렬, 텍스트 장식, 줄 높이와 같은 추가 기능도 제공합니다. 마찬가지로 deltaY 속성을 사용하여 단일 문자의 기준선을 이동할 수도 있습니다.

문법

으아아아

매개변수

  • text - 이 매개변수는 표시하려는 텍스트 문자열인 String을 허용합니다.

  • 옵션(선택 사항) - 이 매개 변수는 텍스트에 추가 사용자 정의를 제공하는 객체입니다. 이 매개변수를 사용하여 스타일이 속성인 개체와 관련된 색상, 커서, 테두리 너비 및 기타 여러 속성을 변경합니다.

옵션 키

  • styles - 이 속성은 개별 문자에 스타일을 추가할 수 있는 Object 값을 허용합니다.

  • deltaY - 이 속성은 스타일의 기준선만 이동할 수 있는 Number 값을 허용합니다.

예 1

스타일 속성만 키로 전달하세요

이 예에서는 스타일 속성을 사용하여 문자에 개별 스타일을 추가하는 방법을 볼 수 있습니다. 이 예에서 볼 수 있듯이, 0번째 문자의 글꼴 크기는 55이고, 글꼴 가중치는 굵게, 글꼴 스타일은 "오블리크"입니다. 첫 번째 수준 속성은 줄 번호이고 두 번째 수준 속성은 문자 기호입니다. 여기서는 0을 사용하여 첫 번째 줄과 첫 번째 문자를 나타냅니다.

으아아아

예 2

deltaY 속성과 함께 스타일 속성을 키로 전달하세요

이 예에서는 deltaY 속성을 사용하여 문자에 다양한 기준선을 추가하는 방법을 살펴보겠습니다. 이 경우 첫 번째 줄의 두 번째 숫자(첫 번째 인덱스)는 deltaY가 지정되었기 때문에 인접 문자와 기준선이 다릅니다.

으으으으

위 내용은 FabricJS를 사용하여 텍스트에서 단일 문자의 기준선을 이동하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
이 기사는 tutorialspoint.com에서 복제됩니다. 침해가 있는 경우 admin@php.cn으로 문의하시기 바랍니다. 삭제