2017-12-03 4 views
0

사용자가 선을 그릴 때 paperjs를 사용하고 있는데, 이전에 그린 선이 교차 할 때 멈추고 싶습니다. 이 내 현재의 테스트 코드 : 사용자가 기존의 경로를 교차 할 때 내가 onMouseDrag 이벤트를 추가 한PaperJS : 이전 패스를 지나갈 때 드로잉 경로를 중지합니다.

tool.minDistance = 1; 

var path; 
var drawing = false; 

function onMouseDown(event) { 
    if (!drawing) { 
     startLine(event); 
     drawing = true; 
    } 
} 

function onMouseDrag(event) { 
    if (drawing) { 
     path.add(event.point); 
    } 
} 

function onMouseUp(event) { 
    if (drawing) { 
     endLine(event); 
    } 
} 

function startLine(event) { 
    path = new Path(); 
    path.strokeColor = 'black'; 
    path.strokeWidth = 10; 
    path.strokeCap = 'round'; 
    path.add(event.point); 
} 

function endLine(event) { 
    path.add(event.point); 
    path.smooth(); 
    path.simplify(); 
    path.onMouseDrag = function(event) { 
     if (drawing) { 
      console.log('ending line') 
      endLine(event); 
     } 
    } 
    drawing = false; 
} 

감지합니다. 이것은 대부분의 경우 작동하지만 때로는 느리게 그릴 때 트리거되지 않습니다.

제 질문은 왜 그 상황에서 onMouseDrag 이벤트가 실행되지 않는 것입니까? 그리고/또는 내가하려는 일을 성취하기위한 더 좋은 방법이 있습니까?

답변

0

더 좋은 방법은 당신이 그려 경로가있는 교차로를 얻기 위해 사용 그릴 때 Path.getIntersections

을 사용하는 것입니다. 물건을 돌려 주면 교차점에서 그릴 것을 그만 두십시오.

도 참조 Path.getCrossings

관련 문제