>웹 프론트엔드 >JS 튜토리얼 >FabricJS - 원점을 기준으로 Line 객체의 위치를 ​​설정하는 방법은 무엇입니까?

FabricJS - 원점을 기준으로 Line 객체의 위치를 ​​설정하는 방법은 무엇입니까?

王林
王林앞으로
2023-08-25 12:13:081445검색

FabricJS – 如何设置 Line 对象相对于原点的位置?

이 튜토리얼에서는 FabricJS를 사용하여 원점을 기준으로 Line 객체의 위치를 ​​설정하는 방법을 알아봅니다. Line 요소는 FabricJS에서 제공하는 기본 요소 중 하나입니다. 직선을 만드는 데 사용됩니다. 선 요소는 기하학적으로 1차원이고 내부가 포함되어 있지 않으므로 채워지지 않습니다. fabric.Line 인스턴스를 생성하고 선의 x 및 y 좌표를 지정하고 이를 캔버스에 추가하여 선 객체를 생성할 수 있습니다. 원점을 기준으로 Line 객체의 위치를 ​​설정하려면 setPositionByOrigin 메서드를 사용합니다.

문법

으아악

매개변수

  • pos - 이 속성은 개체의 새 위치를 설정할 수 있는 fabric.Point 값을 허용합니다.

  • originX - 이 속성은 수평 원점을 설정할 수 있는 String 값을 허용합니다. 가능한 값은 "왼쪽", "중앙", "오른쪽"입니다.

  • originY - 이 속성은 수직 원점을 설정할 수 있는 String 값을 허용합니다. 가능한 값은 "상단", "중앙", "하단"입니다.

setPositionByOrigin 메소드의 기본 위치를 사용하지 마세요

setPositionByOrigin 메서드를 사용하지 않고 Line 객체의 기본 위치를 확인하는 코드 예제를 살펴보겠습니다.

으아악

setPositionByOriginmethod

사용

코드 예제를 통해 setPositionByOrigin 메소드를 사용할 때 Line 객체가 어떻게 보이는지 살펴보겠습니다. 이 예에서는 x 및 y 좌표가 각각 500과 100인 Point 개체를 초기화하여 개체의 새 위치를 지정합니다. 수평 원점을 "중앙"으로, 수직 원점을 "상단"으로 생각하여 선 개체의 새 위치를 설정합니다.

으으으으

위 내용은 FabricJS - 원점을 기준으로 Line 객체의 위치를 ​​설정하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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