I'm trying out Paper.js for fun, but it seems I'm already stuck at the very start.
Adding resize=true to the canvas tag is supposed to make the element as high and wide as the browser window. However, doing that results in some rather strange behavior.
I expected the canvas to adjust itself to the viewport right after loading the page, but it didn't do so, which is why I initially thought it didn't resize at all. What actually happens, though, is even more bizarre: The canvas starts out at its default size of 300x150, and when I resize the viewport, it grows - slowly, but indefinitely.
For the record, I've tried using data-paper-resize=true or just resize instead, or using Chrome instead of Firefox - all to no avail.
I'm not expecting an answer if this problem is caused by some inexplicably weird setup on my end. I am wondering, however, if the problem is common (or even known to exist at all) and has known causes and solutions.
Here's the code I'm using:
<!doctype html>
<html>
<head>
<meta charset=utf-8>
<script type=text/javascript src=paper-full.min.js></script>
<script type=text/paperscript canvas=myCanvas>
var path = new Path();
path.strokeColor = 'black';
path.moveTo(new Point(120, 120));
path.lineTo(new Point(500, 500));
</script>
</head>
<body>
<canvas id=myCanvas style=border: 1px dotted red; resize=true></canvas>
</body>
</html>
