이 튜토리얼에서는 FabricJS를 사용하여 직사각형을 보이지 않게 만드는 방법을 알아봅니다. Rectangle은 FabricJS에서 제공하는 다양한 도형 중 하나입니다. 직사각형을 생성하려면fabric.Rect클래스의 인스턴스를 생성하여 캔버스에 추가해야 합니다.
크기 변경, 배경색 추가, 표시 또는 숨기기 등 다양한 방법을 사용할 수 있습니다.visible속성을 사용하여 이를 수행할 수 있습니다.
new Fabric.Rect( {visible: Boolean }: Object)매개변수< h2>
옵션(선택 사항)- 이 매개변수는객체우리 직사각형으로. 이 매개변수를 사용하면 속성이visible인 개체와 관련된 색상, 커서, 획 너비 및 기타 속성을 변경할 수 있습니다.
표시;/ Strong> - 이 속성은 개체를 캔버스에 렌더링할 수 있게 해주는부울값을 허용합니다. 기본값은true입니다.
표시 속성 전달 'true' 값을 갖는 키로
visible을 전달할 때 무슨 일이 일어나는지 이해하기 위해 코드 예제를 살펴보겠습니다. 부동산의 진정한 가치. 값을 "True"로 지정함으로써 우리는 직사각형 개체가 캔버스에 렌더링됩니다. 이는 기본 동작이기도 합니다. FabricJS.
<머리> 머리> <본문>표시되는 속성을 값이 'True'인 키로 전달합니다
캔버스에 직사각형 개체가 렌더링된 것을 확인할 수 있습니다.
<스크립트> //캔버스 인스턴스 시작 var canvas = new Fabric.Canvas("캔버스"); canvas.setWidth(document.body.scrollWidth); Canvas.setHeight(250); //사각형 객체 초기화 var 직사각형 = 새 천.({ 왼쪽: 55, 상단: 60, 폭: 170, 신장: 70, 입력: "#f4f0ec", 뇌졸중: "#2a52be", 스트로크 폭: 5, 가시적 : 실제, }); //캔버스에 추가 canvas.add(직사각형); 스크립트>
'False' 값을 사용하여 표시 속성을 키로 전달
< ;p> ;이 예에서는visible속성을 값이 false인 키로 전달합니다. false 값을 지정하면 직사각형 객체가 캔버스에 렌더링되지 않습니다. 개체를 "보이지 않게" 만드는 것이 아니라 완전히 제거합니다. 코드를 삭제하지 않고 캔버스에서 개체를 제거하는 데 사용할 수 있습니다.<머리> 머리> <본문>표시되는 속성을 'False' 값을 갖는 키로 전달합니다
직사각형 개체가 캔버스에 렌더링되지 않은 것을 확인할 수 있습니다.
<스크립트> //캔버스 인스턴스 시작 var canvas = new Fabric.Canvas("캔버스"); canvas.setWidth(document.body.scrollWidth); Canvas.setHeight(250); //사각형 객체 초기화 var 직사각형 = 새 천.({ 왼쪽: 55, 상단: 60, 폭: 170, 신장: 70, 입력: "#f4f0ec", 뇌졸중: "#2a52be", 스트로크 폭: 5, 표시: 거짓, }); //캔버스에 추가 canvas.add(직사각형); 스크립트> 본문>
위 내용은 FabricJS를 사용하여 직사각형을 보이지 않게 만드는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!