search

paperjs / paperjs.org

The source of the Paper.js website http://paperjs.org, translated to the static pages in https://github.com/paperjs/paperjs.github.io by running it through https://github.com/paperjs/woods in a Travis CI worker on each commit.
48 stars 34 forks source link

Animations using js #22

Closed QuinDennis closed 8 years ago

QuinDennis commented 8 years ago

Doesn't look like paper.js works with animation via JS. The onFrame below works as expected, using setInterval and rotate doesn't rotate. However, moving the mouse over the rect causes it to advance 3 degrees as long as the mouse is moving.

(I'm coming from snap.svg where rotations work as expected)

paper.install(window) window.onload = function() { paper.setup('myCanvas') var rect = new Path.Rectangle([75,75], [100,100]) rect.strokeColor = 'black'

//view.onFrame = function(event) {
//    rect.rotate(3)
//}
setInterval(function(){
    rect.rotate(3)}, 500)

}

lehni commented 8 years ago

You need to update the view if you use events that are outside of what paper.js offers:

Just add this and it will work as expected:

view.update();

PS: This is a bug database (and this one here is for the paperjs.org website, not the framework itself, which is over at github.com/paperjs/paper.js). But support questions should go to the mailing list http://groups.google.com/group/paperjs

QuinDennis commented 8 years ago

Wow, thanks for the prompt response! I began to suspect there was a solution like that, just hadn't learned enough about it yet. Nice library!

QuinDennis commented 8 years ago

Sorry to bother you again, but animating has a big memory leak. Using Update or onFrame, memory and CPU usage reaches critical levels within 15 seconds. Is there something I'm missing? Is this a Bug?

lehni commented 8 years ago

This issue is closed. Support questions should go to the mailing list, please: http://groups.google.com/group/paperjs