Paper.js simle shapes

by 20yco

HTML

<script src="http://paperjs.org/assets/js/paper.js"></script>
<canvas id="canvas_view" width="500" height="400"></canvas>

CSS

#canvas_view {
    border: 1px solid #ddd;
}

JavaScript

var canvas = document.getElementById('canvas_view');
paper.setup(canvas);
var path = new paper.Path();
path.strokeColor = 'black';
var start = new paper.Point(100, 100);
path.moveTo(start);
path.lineTo(start.add([ 200, -50 ]));
paper.view.draw();

//var CANVAS = document.getElementById('canvas-view');
//paper.install(CANVAS);
var rectangle = new paper.Rectangle(new paper.Point(10, 10), new paper.Point(200, 200));
var path = new paper.Path.Rectangle(rectangle);
path.fillColor = '#e9e9ff';

console.log(paper);