HTML5 kineticjs 그릴 여러 줄로 여기로

Question

: KineticJS - Drawing Lines with Mouse

KineticJs는 선, 도형 및 드래그 &을 드롭을 그리기 위해 잘 작동합니다. 실제 예제에서는 항상 같은 선을 다시 그리기, 무대에서 여러 개의 선을 그릴 수있는 방법을 궁금합니다.

Answer 1

새 줄을 만들어 mousedown의 레이어에 추가 할 수 있습니다.

 stage.on("mousedown", function(){ 
      if (moving){ 
       moving = false;layer.draw(); 
      } else { 
       var mousePos = stage.getMousePosition(); 
       //CHANGED - Create new line 
       line = new Kinetic.Line({ 
        points: [0, 0, 50, 50], 
        stroke: "red" 
       }); 
       //CHANGED - Add line to layer 
       layer.add(line); 
       //start point and end point are the same 
       line.getPoints()[0].x = mousePos.x; 
       line.getPoints()[0].y = mousePos.y; 
       line.getPoints()[1].x = mousePos.x; 
       line.getPoints()[1].y = mousePos.y; 

       moving = true;  
       layer.drawScene();    
      } 

     }); 

확인 데모 : 내가 필요 정확히 무엇 http://jsfiddle.net/QTsgn/