FabricJS 캔버스, 스크롤링 상위 컨테이너가 하위 히트 영역 이동

Question

FabricJS를 사용하여 응용 프로그램을 만듭니다. 부모 div/container를 스크롤하면 스크롤되는 양과 직접 관계가있는 객체의 선택 가능한 영역을 오른쪽으로 오프셋한다는 것을 알았습니다.

그래서 캔버스가 1200x600이고 컨테이너 div가 600x600이고 캔버스에 400, 120을 추가하면, 200px로 스크롤 할 때 rect를 클릭하여 선택할 수 없습니다. 오히려, 마우스를 600, 120 (빈 공간)으로 이동시켜야 크로스 바를 가져와 rect를 선택해야합니다.

이 사실을 알고 있거나 해결할 수 있는지 확실하지 않은 경우에는 가능하지만 도움을 주시면 감사하겠습니다.

Answer 1

작동하려면 FabricJs 코드를 수정해야합니다. 문제는 getPointer 함수에 있습니다. all.js에서이 함수를 검색하면 kangax에서 "이 메소드는 수정이 필요합니다"라는 주석이 있음을 알 수 있습니다.

해결 방법은 "컨테이너"를 캔버스의 래퍼 사업부는

function getPointer(event) { 
    // TODO (kangax): this method needs fixing 
    return { x: pointerX(event) + document.getElementById("container").scrollLeft, y: pointerY(event) + document.getElementById("container").scrollTop }; 
} 

으로이 기능을 대체 할 수 있습니다. 정확한 ID를 써야하기 때문에 좋지는 않지만 작동합니다.

희망이 도움이됩니다.