paperjs

I am playing around with the nice code from http://paperjs.org/examples/candy-crash/ . I want to replace the colors with an image so that instead of showing say a red circle, it should show a circle with an image inside. Here is the snippet I think I need to modify: function Ball(r, p, v) { this.radius = r; this.point = p; this.vector = v; this.maxVec = 15; this.numSegment = Math.floor(r / 3 + 2); this.boundOffset = []; this.boundOffsetBuff = []; this.sidePoints = []; this.path = new Path({ fillColor: { hue: Math.random() * 360, saturation: 1, brightness: 1 }, blendMode: 'screen' }); for (var

I tried installing paperjs by using the command sudo npm install paper in my angular app folder. Paper seems to appear in node_modules folder, however when I try to import it using import { Paper } from '@paper' it doesn't find paper module. How do I include the paper module in angular2? I did the following to get it working: npm install paper --save npm install @types/paper --save In systemjs.comfig.js add a map for paper map: ... 'paper': 'npm:paper/dist/paper-core.js' }, In the component import { PaperScope, Path, Point } from 'paper'; Following this thread there is no official typescript

I've grown to like paper.js a lot but after realizing that it does not support IE8, I was wondering if it was possible to have paper.js working together with excanvas? Has anyone tested this and are there examples available? Thank you. The Paper.js code explicitly uses HTMLCanvasElement (line 7137 in dist as of 8/11/12 ), which does not exist on IE8, so out of the box the code fails. The paperjs About page says: Paper.js is aimed at modern browsers with support for the Canvas object and EcmaScript 5. Even though in theory it is possible to write code that works in older browsers (Yes Explorer

I am new to Paper.js, and I was wondered by the event system, while reading tutorial. Thats how event hanling described in tutorial : var path; function onMouseDown(event) { // Create a path: path = new Path(); path.strokeColor = 'black'; // Add the mouse down position: path.add(event.point); } function onMouseUp(event) { // Add the mouse up position: path.add(event.point); } So, its just functions in global namespace... Eventually I have a few questions about it, and I didnt found anything on the internet on this: - How to bind event handler to particular canvas? - How to bind event handler

Is there a recommended way to extend classes in Paper.js? In particular, I am interested in extending Path Pardon if my terminology is incorrect, but I am essentailly asking the same question about paper that is being asked about three here beaslera Based on your comment to the initial version of my answer, you are looking for the 'extend' function (oops, that was exactly what you meant) to do subclassing. In an email to the paper.js mailing list , Jürg Lehni (one of the creators) said: As for subclassing, that's not something that is supported at the moment. It might work, it might not, it

I'm trying to use paper.js in a webapp, but I've been unable to get it to work with multiple canvases. It's like the scopes are getting mixed up between the canvases, so when I intend to draw on canvas 1, it appears on canvas 2. In each view, I'm initialize the paper like this: this.mypaper = new paper.PaperScope(); this.mypaper.setup($("myCanvasId")[0]); When I create new paper objects, I use what should be the local scope: var circle = new this.mypaper.Path.Circle(10, 10, 5); However, when I create a circle in view1, it draws it in view2 instead. I've done a lot of reading, but I still haven

Is it possible to easily draw text along the bezier curve using paper.js ? I know it is possible to attach text to a line path and then rotate it, but I am interested specifically in drawing text along the curve. Something like http://www.w3.org/TR/SVG11/images/text/toap02.svg I understand this may be achieved by printing text a letter by letter with corresponding rotation applied to every item, but I am interested in easier way to achieve this in paper.js We haven't implement text along path in Paper.js yet. At the moment, text support is rather rudimentary, but this will hopefully change

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