2017-12-03 16 views
0

paperjsを使用しています。ユーザーが線を描画するときに、以前描画した線と交差したときに停止します。これは私の現在のテストコード: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イベントを追加して、ユーザーが既存のパスを越えたときを検出しました。これはほとんどの場合動作しますが、特に遅く描画するときにトリガされないことがあります。

私の質問は、その状況でonMouseDragイベントがトリガーされないのはなぜですか?そして/または私がやろうとしていることを達成するためのより良い方法がありますか?

答えて

0

良い方法は、あなたが描かれたパスとの交点を得るためにそれを使用して描画する場合Path.getIntersections

を使用することです。何かを返す場合は、交差点で描画を停止します。

も参照してください。Path.getCrossings

関連する問題