Soft Body Physics in paper.js?

[Guardabrazo]

Hi there!

I am working with some basic shapes in paper.js and I would like them to behave as if they were made from jelly when dragging and moving them.

This is the kind of behavior I am talking about: http://youtu.be/ht7tuGG1vlY

Do you know a way to simulate these physics in plain paperScript? JavaScript could do the trick too...but I am too lazy and nooby to rewrite the code in javaScript :-)

Thanks a lot!

[Guardabrazo]

Well....I've been doing some tests trying to link paper.js with verlet.js, a nice library that works with soft bodies physics.

Basically I have created a verlet simulation entity and then draw a paper path that goes trough the nodes of the simulation entity.
The first problem that I have is that the paper drawing animation using onFrame(event) doesn't clear the background as it usually does. I've been able to fix this drawing a background rectangle before the path. Using context.clearRect doesn't seem to work either.

The second problem is that it runs veeeery slow. If you just draw the simulation particles and constraints (line 48 in the HTML code) it runs smoothly, but when it tries to draw the paper path it slows down a lot.
Other issue that I cannot fix is that I can't draw both the simulation and the path at a time. There must be a conflict between those two that I can't figure out.

Please be aware that I am a total beginner with JavaScript in particular and programming in general. So....forgive me if my code hurts your eyes. :D


Here is a link to the HTML file and the libraries I've been using.
https://dl.dropboxusercontent.com/u/40549469/Paper%2BVerlet%20example.zip

Thank you very much!

[Jürg Lehni]

Paper.js does clear the rectangle for you.

But you need to be aware thatit differs to other frameworks such as processing in the sense that you create a scene graph / DOM rather than directly giving drawing commands. The objects you create are then drawing themselves in the frame / draw loop.

So what you describe sounds like instead of creating your elements once and then modifying them according to the verlet simulation, you're creating a new scene graph on each frame, but are not getting rid of the old one. This also explains why it slows down so much.

I don't have time to look into the code right now, but hope that this feedback will help improving your code?

Best,

Jürg

> --
> You received this message because you are subscribed to the Google Groups "Paper.js" group.
> To unsubscribe from this group and stop receiving emails from it, send an email to paperjs+u...@googlegroups.com.
> For more options, visit https://groups.google.com/groups/opt_out.
>
>