Rotate mesh based on x and z coordinates

i am moving mesh based on raycasted direction (x,z)

i know how to rotate mesh based on camera look direction

let rotation = camera.getWorldDirection(lookingDirection)
let yaw = Math.atan2(rotation.x,rotation.z)
cone.rotation.y = yaw;

how can i achieve same rotation with only x and z coordinates ?

https://jsfiddle.net/fk2bu8op/

Maybe rotateOnWorldAxis might be easier?

i tried this https://jsfiddle.net/fk2bu8op/ but i do not know how to do it correctly

Can you explain the behaviour you want?

to turn the mesh to the direction it is moving , like in games example world of warcraft ,when you click with mouse on ground, player moves to that position and faces that direction

You would need the angle and the correct axis for the rotation.
The angle can be calculated using the method you had earlier. You could do it by comparing the x, y position w.r.t the center of your renderer.
For the axis you’d need a vector from the center of the object to the center of your renderer.
Then you can call the rotateOnWorldAxis method on the central cone object with those arguments.
Hope that makes it a bit clearer.

angle i calculated , i do not get it , axis i need center of my Cone ? and center of my renderer (screen ?)

here what i got of what i understood https://jsfiddle.net/fk2bu8op/ but need to figure out to do it correctly

I created a new fiddle to separate the code: https://jsfiddle.net/amitlzkpa/6px5b0mu/

Used a slightly different technique where the cone is made to lookAt the cursor first, then it’s rotated to make the top of the cone point towards the cursor.

Added in a part to move the cone towards the cursor.

the problem with this approach is , the player (impor ted character mesh from blender) is facing to floor,but directions are correct

i made it :smiley:
me.mesh.rotation.set(0,angle,0) //angle in radians

1 Like