Path VS Shape in Paperjs?

animation, html, javascript, paperjs

Solution

By default, transforms are applied directly to a `path` object, not stored in the item's `Matrix`. This is controlled by the `applyMatrix` property. You can change this behavior globally by adding:

settings.applyMatrix = false;

to your paperscript, or on the item level with:

this.head = new Path.Rectangle({
    center: [0, 0],
    size: [40, 40],
    fillColor: 'white',
    applyMatrix: false
});

Problem

I have an interesting issue with the Paperjs library. The behaviour of polygon created by path's is very different from the behaviour of objects created by shape. The path object when applied with a Rotation treats it like a ninja star while the motion I desire is perfectly done. Here are the fiddle links for each of the cases. ``` Path.Rectangle({ center: [0, 0], size: [40, 40], fillColor: 'white' }); ``` Path fiddle ``` Shape.Rectangle({ center: [0, 0], size: [40, 40], fillColor: 'white' }); ``` Shape fiddle

Original source