2017-03-07 2 views
0

Paper.js에서 직사각형을 그릴 수 없습니다. 나는 튜토리얼을 따라 왔지만 아무것도 작동하지 않는 것 같다. 아래 코드에 어떤 문제가 있는지 말해 줄 수 있습니까?Paper.js에 직사각형을 그리는 방법?

<!DOCTYPE html> 
<html> 

<head> 
<!--load paper.js--> 
<script type="text/javascript" src="http://localhost/node_modules/paper/dist/paper-core.js"></script> 

<!--drawing script--> 
<script type="text/javascript" canvas="canvas"> 
window.onload = function() { 
    var canvas = document.getElementById("canvas"); 

    paper.setup(canvas); 

    var meterStart = new paper.Point(5,5); 
    var meterSize = new paper.Size(40, 720); 
    var meter = new paper.Rectangle(meterStart, meterSize); 
    meter.strokeColor = 'black'; 
    paper.view.draw(); 

    } 
</script> 
</head> 

<body> 
<canvas id="canvas" height="750px" width="600px"></canvas> 
</body> 

</html> 

답변

2

사용중인 코드가 실제로 사각형을 올바르게 그려 내지 않습니다. 대신 사각형 객체 만 정의합니다. 내가 알 필요가 무엇 https://jsbin.com/niwegobanu/edit?html,js,output

<!DOCTYPE html> 
<html> 

<head> 
<!--load paper.js--> 
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/paper.js/0.10.2/paper-full.js"></script> 

</head> 

<script type="text/paperscript" canvas="myCanvas"> 
    var rectangle = new Rectangle(new Point(50, 50), new Point(150, 100)); 
    var path = new Path.Rectangle(rectangle); 
    path.fillColor = '#e9e9ff'; 
    path.selected = true; 
</script> 
</head> 
<body> 
    <canvas id="myCanvas" resize></canvas> 
</body> 
</html> 
+0

:

여기에 사각형을 그릴 수있는 올바른 방법입니다. 감사! – imsamimsamimsam

+0

자세한 정보는 여기에서 찾을 수 있습니다. http://paperjs.org/tutorials/paths/creating-predefined-shapes/ 도움이된다면이 포스트에 upvote를 남겨주세요. – ethanchewy

관련 문제