cannon.js icon indicating copy to clipboard operation
cannon.js copied to clipboard

Player controls - or - How to move a physical object

Open DerDu opened this issue 10 years ago • 10 comments

Ok, after two weeks, I am now ready to give up. I have searched the Internet, studied all the examples and almost looked at the complete source code ... I simply lack the necessary knowledge to work with cannon.js.

I want to rotate a cube by keyboard :( .. and have no idea how to do that.

Three.js and Cannon.js work, as well as keystrokes.

I am using the proposed method to syncronize the objects.

rigidbody.position.copy (mesh.position); 
rigidbody.quaternion.copy (mesh.quaternion); 

I can move the cube (more bad than good)

rigidbody.velocity.x = 5; 

But:

  • I can not rotate it
  • And y-axis does not remain perpendicular

I'm lost ... :'(

All I want is a cube that I can move by physics as a player on a plane (other cubes, somewhat like minecraft) .. How the hell do I use wasd (and spacebar for jump) events to move it correctly?

ps: sample code for keyboard events would be appreciated..

DerDu avatar May 12 '14 11:05 DerDu

Hi,

you might want to look at this: https://github.com/dirkk0/fps0

Best, Dirk

On Mon, May 12, 2014 at 1:09 PM, Gerd Christian Kunze < [email protected]> wrote:

Ok, after two weeks, I am now ready to give up. I have searched the Internet, studied all the examples and almost looked at the complete source code ... I simply lack the necessary knowledge to work with cannon.js.

I want to rotate a cube by keyboard :-( .. and have no idea how to do that.

Three.js and Cannon.js work, as well as keystrokes.

I am using the proposed method to syncronize the objects.

rigidbody.position.copy (mesh.position); rigidbody.quaternion.copy (mesh.quaternion);

I can move the cube (more bad than good)

rigidbody.velocity.x = 5;

But:

  • I can not rotate it
  • And y-axis does not remain perpendicular

I'm lost ...: '- (

All I want is a cube that I can move by physics as a player on a plane (other cubes, somewhat like minecraft) .. How the hell do I use wasd (and spacebar for jump) events to move it correctly?

ps: sample code for keyboard events would be appreciated..

— Reply to this email directly or view it on GitHubhttps://github.com/schteppe/cannon.js/issues/136 .

dirkk0 avatar May 12 '14 12:05 dirkk0

Ty, already had a look and it seems to me (correct me if i wrong) you "replace" e.g the boxBody.quaternion.. properties with obj.quaternion.. so if tjs pl controls triggers its just "dirty updating" boxBody (without correct physics, but works for small/continued changes) from obj.. thats not what i want.. i dont want to touch the tjs obj at all.. i want to influence boxBody and tjs is only for display..

maybe i missed to get that clear..

  • my goal is a keyboard control (3rd person) which uses velocity(?) to manipulate a rigid body..
  • except y-axis which should always point upwards
  • the corresponding visible tjs obj is then moved to mirror the physical quaternation/position/dimension/etc..

so.. eg. in tjs you got

  • .translateOnAxis
  • .rotateOnAxis

and i try to get this kind of functions to work in pure physics..

DerDu avatar May 12 '14 14:05 DerDu

Same question, actually. The example manipulates (several) THREE.Object3D objects and then copies their positions onto the physics body.

It seems like you could set body.angularVelocity (which is a CANNON.Vec3) go give a body a jolt to rotate on a given axis.

Anyone have a better idea?

ghost avatar Sep 18 '14 02:09 ghost

Maybe one of the followings helps. https://codepen.io/Tomo0613/pen/xVjqqK In this solution the Y axis is changing as well, and I'm struggling with multiple key presses.

And i found this BasicThirdPersonGame tutorial. It could be useful. http://matthiasschuetz.com/three-basicthirdpersongame/demos/demo1_simple.html http://matthiasschuetz.com/three-basicthirdpersongame/docs.php

As i see, in 3D you have to use Quaternions if u want rotating something. And as far as i know: If u multiply a quaternion with a vector, than u get a direction vector. var simpleVector = new CANNON.Vec3(x,y,z); var rotatedVector = body.quaternion.vmult( simpleVector ); Check the first link how to use. Pls correct me if I'm wrong.

tomo0613 avatar Apr 21 '16 17:04 tomo0613

how is that code pen even running? there are places in the code where variables are undeclared, some where they are redeclared. lots of hot tips in there but the code is driving me bonkers.

ashleymvanduzer avatar Apr 13 '21 14:04 ashleymvanduzer

(yeah... a lot of syntax errors... I wrote that a long time ago :) ) Which parts are the most chaotic? I could give you some clarification

tomo0613 avatar Apr 13 '21 14:04 tomo0613

hey thanks! I'm kinda confused about line 91 and 92. why is accelerationImpulse declared twice? or is that a typo? and how about where you are declaring the cannon JS objects? stoneShape and stoneBody, and shape and body are not declared... how does that work?

ashleymvanduzer avatar Apr 13 '21 15:04 ashleymvanduzer

this is really cool by the way. I have been trying to figure out how to do this for days and this is by far the best example I have found.

ashleymvanduzer avatar Apr 13 '21 15:04 ashleymvanduzer

this line: var accelerationImpulse = new CANNON.Vec3(0,0,acceleration); should be: var accelerationDirection = new CANNON.Vec3(0,0,acceleration); (different name) it is only used for vmult(acc.Dir.)

In JS (in browser) if you omit the key word var/let/const when declaring a variable, it would behave the same way as if you would declare as a property of the window object and you can also omit window keyword when accessing these variables. That's why it still works. (but usually these are mistakes, like in my case.) myVariable = 1; is the same as window.myVariable = 1; also console.log(myVariable) the same as console.log(window.myVariable)

tomo0613 avatar Apr 13 '21 17:04 tomo0613

so the impulse is the product of* the vector multiplication then... good to know! about the variables, I think I read that bit somewhere. Thanks for clarifying all that :)

ashleymvanduzer avatar Apr 14 '21 01:04 ashleymvanduzer