Fabric.js : 캔버스에서 하나 또는 여러 개체의 선택을 해제하는 방법?

Question

예를 들어, 캔버스에 여러 개의 객체가 있습니다. , * B * 및 입니다. 이러한 개체 중 세 개는 활성화 된 개체로 선택됩니다. Fabric.js를 사용하면 개체를 버리고 비활성화 할 수 있습니까? ?

예를 들어 세 개의 개체가 선택된 상태에서 캔버스 밖에있는 단추를 클릭하면 개체 B가 삭제되거나 비활성화됩니다.

나는 FabricJS 공식 웹 사이트에 문서 파일로보고, 나는 단지 canvas.deactivateAll(), canvas.discardActiveObject()를 발견했다. 이 기능은 특정 활성 개체가 아닌 모든 활성 개체를 비활성화 할 수 있습니다.

누군가 나에게 안내서를 제공해 줄 수 있습니까? 감사!

여러 개체가 활성화

, 실제로 그룹을 형성 :

Answer 1

난 그냥 그렇게 할 수있는 방법을 발견했다. 그런 다음 실제로는 "removeWithUpdate"라는 fabric.group 메소드를 사용해야 만합니다.

예 :

var activeGroup = canvas.getActiveGroup(); 
activeGroup.removeWithUpdate(theObject); 
canvas.renderAll(); 

Answer 2

내가 늦게 응답 할 수도 있지만, 최신 fabricjs (1.4.3)에서 사용할 수있는 캔버스에 선택한 모든 객체를 선택 해제하려면 다음.

canvas.deactivateAll().renderAll(); 

저는 캔버스 이미지를 만들기 전에 이것을 사용하고 있습니다. 누군가가 도움이되기를 바랍니다.

Answer 3

objectA, ObjectB 및 ObjectC의 3 개의 개체가 있고 개체가 선택되어 있다고 가정합니다. 이제 임의의 객체 (예 : ObjectB)의 선택을 취소하려는 경우 이 경우 다음 코드를 시도해 볼 수 있습니다.

활성화 된 노드가 하나 뿐인 경우 할 수 있습니다.

canvas.discardActiveObject(); 
canvas.renderAll(); 

Answer 4

는 함수가 직물에 의해 호출되는 경우 마우스 이벤트의 결과로 function.Discards 현재 활성화 된 그룹 및 화재 이벤트 아래에 사용할 수있는 모든 활성 그룹을 삭제하려면 이벤트는 parmater로 전달 및 전송됩니다 커스텀 이벤트의 발동 기능 메서드로 사용되는 경우 e 매개 변수에는 응용 프로그램이 없습니다.

canvas.discardActiveGroup(); 

이렇게하면 사용할 수 있습니다. 현재 활성 객체 및 화재 이벤트를 버립니다. 함수가 마우스 이벤트의 결과로 패브릭에 의해 호출되면, 이벤트는 매개 변수로 전달되고 사용자 정의 이벤트의 화재 기능으로 전송됩니다. 메서드로 사용되는 경우 e 매개 변수에는 응용 프로그램이 없습니다.

canvas.discardActiveObject(); 

그리고 마지막으로 마지막으로 상단 캔버스와 보조 컨테이너 캔버스를 렌더링합니다.

canvas.renderAll();