Having issue with app.systems.ballsocketjoint in picker.js script in the Ragdoll example project


I’m currently trying to make something similar to the Virtual Voodoo ragdoll behaviour, and I came across the ragdoll example project https://playcanvas.com/project/431888/overview/ragdoll , what I’m trying to know is how to use the picker.js script provided in the project scripts. what exactly is the setup I need to click on some bone collider and select it and move the whole ragdoll from the selected joint? From my readings, I gather that the Picker.js is the script to handle such a task. Am I correct, or missing a crucial point here?

Thank you guys in advance.

There are a few ways to do the picking. I think in Virtual Voodoo I did a basic physics raycast and created a new ball joint at the point of intersection and moved the joint with the mouse position.

So the picker script is a good starting point ?
An also, I’m don’t really know much about the structure or API of the engine, but I’ve searched the github repository and the the forum for a reference on the app.systems.ballsocketjoint, but came across nothing. is there a way to know further on the subject ?
Lastly, and forgive me for my too many questions, How should I move the joint, from its rigidbody (using teleport/ entity.setposition) or using the entity that has the joint script ?

Sorry if I’m confusing you with this. thanks.

I haven’t used it myself so have no idea what it does. The physics raycasting I referred to can be seen in an example project here: https://developer.playcanvas.com/en/tutorials/entity-picking-using-physics/

AFAIK, the joint/socket etc for the physics hasn’t been exposed in the PlayCanvas API (aka it’s not a supported feature) but it does exist in the ammo.js physics library that PlayCanvas uses. The ragdoll project from Will that I think you are using should have code examples how to create one.

I honestly can’t remember how I did it. I can’t remember if I was moving the joint or another rigid body. My guess was that I as moving the joint directly, not the rigid bodies it was attached nor the entity.

Great, I really do appreciate your quick reply. Thanks.

I think I managed to make it work, I will share my code as soon as I get to a stable state.

OK, I reckon I’m stuck here, I’m creating a joint (or at least it’s what I think I’m doing) with the entity I’m picking but still can’t figure out how to move it with the mouse position properly. here’s a link to my project (https://playcanvas.com/project/586306/overview/my-ragdoll). Take a look at the picker.js script, it’s where I’m picking an entity to drag the ragdoll by. You will see in the onMouseMove function that I’m tracking the mouse position and feeding it to the joint that i created and its rigid body as well. If the rigidbody is dynamic and I use teleport funtion to move the ragdoll, it gets thrown way far back the z axis even though I assign the z axis of mouse position to the ragdoll z value. and If make the rigid body kinametic and move it using setPosition(), it just gets stuck in its very first position. What do you reckon I should do here ? thanks @yaustar

I looked at the minified code from Virtual Voodoo (game link here: https://www.miniclip.com/games/virtual-voodoo/en/). Looks like a I did a few things:

  • I had a static rigid body that was teleported to the projected position in the world from the mouse position (so it was always under the mouse pointer)
  • That rigid body had a physics filter (again, not exposed in the PlayCanvas engine but there’s examples on the forums) so it doesn’t collide with anything
  • When the mouse button is pressed, I do a raycast. If it hits a ragdoll part (IIRC, all the parts have a tag), I create a joint that connects the two rigid bodies together with an offset based on the intersection point of the raycast
  • When I release the mouse, I destroy the joint

There’s no Z position of the mouse pointer.

OK, I’m astronomically gratefull @yaustar, it worked just fine with me now. The issue as I said was with the farClip position of the camera from which I get the translated mouse position, everything else is the same as you told me. Thanks again.

the project is here for any one to see how you can make a behaviour like that of the Virtual Voodoo draggable ragdoll. Cheers.

link for the project since the above link is not working anymore : https://playcanvas.com/project/586677/overview/my-ragdoll

1 Like

Awesome, great job!

As an added note, if you want to align the position along a plane (i.e only move the ragdoll along 2 fixed axis, there’s the pc.Plane (https://github.com/playcanvas/engine/blob/master/src/shape/plane.js) and do another raycast using the camera position and the screenToWorld project position to get a position on the plane. There’s an example here with a box but it’s basically the same API https://developer.playcanvas.com/en/tutorials/simple-shape-raycasting/

Thanks, this is very helpful.