Three.js : Absolute coordinates of point on surface [duplicate] - three.js

I have a 3D object. "Attached" to it is a point. When the object is moved or rotated, the point moves and rotates with it.
Given the object's position and rotation, how can the position of the point in world space be calculated? (Using THREE.js's API if possible)
Thanks

For a point in an object's local coordinate system,
object.localToWorld( point );
will return the world coordinates of the point, assuming the same transform is applied to the point as is applied to the object.
three.js r.55

Related

Cannon.js - Visualise body velocity path

I'm using Cannon.js with Three.js.
I have a basic scene which on mouse click adds a sphere to Three.js & Cannon.js. The sphere has a velocity set of 100, and Cannon.js simulates the path the sphere takes, from point A to point B.
Is there a way to simulate this force and draw a line from point A (sphere starting position) to point B (sphere end position after velocity is applied)?
Or instead of simulating this, a way to calculate the path the sphere will take based on the velocity?
Thanks in advance!
I'm pretty sure that neither cannon.js or three.js has a vector class. Luckily I designed an example that should show you how to implement one into whatever you're working on here.
The example basically scales a vector object in accordance to the cube's velocity. It updates this every time all other physics are updated.

Raycasting through a custom camera projection matrix

After modifying my main camera's projection matrix, the ScreenPointToRay method that use ray casting begin to fail, so the method which detect touched object use raycast fail too. Is there any way to use ScreenPointToRay method with a custom camera projection matrix?
If you made a custom camera projection matrix, then you probably know where is the user pointing to, how about casting a ray yourself and not using the helper?
If you have a problem with translation of the cursor to world position, there is a good approximation - take four angles on approxiamtely the edges of your camera's viewpoint (top of the viewport horizontal center, left of the viewport vertical center etc.) and interpolate between them.

Three JS How to make ray or rays from camera to all object in rederer to check faceIndex

I have some project for child http://kinosura.kiev.ua/sova/ and i need to check faceIndex of all cubes in screen.
Now i use intersections array from mouse, but is working only when user pointer at the cube.
How to make ray or rays from camera to all object to check faceIndex ?
I try to make four rays to cubes but if i set cube.position as origin of like this:
raycaster.setFromCamera( cube1.positoin , camera )
I get empty array of intersections.
I also try to set static 2d vector as origin (get coordinate from mouse) but i have relative renderer size and this coordinate all time change... its not work(
Thanks for answer anyway.
I suggest that you try another approach It appears that your cubes do not cover one another, relative to the camera view. So use the surface normals, and compare them to the view direction to determine if they are facing the camera or facing away from the camera by a simple one-per-polygon dot product.
When you are creating your geometry, before adding it a THREE.Mesh call .generateFaceNormals() on it.
Instead of ray casting, iterate through all faces, grab the surface normal of the face, transform relative to the view (inverse transpose of the object's matrix), then dot(). might sound complicated, at first, but it's actually just a couple of steps and much faster than doing a lot of raycasts (which will probably include this anyway!)

Convert coordinates of a child object to world coordinates

I'm quite new to three.js and lacking some basic understanding of the coordinate systems obviously.
I have an Object3D "group" that has some children (planes). I use "group" to rotate the group of planes, which works fine. Now camera can move and parent object can rotate. One can click on the planes to select them. What I want now is to let the selected plane fly into the camera.
If I just move the plane to the camera position it flys in any direction but mostly not to the camera. Certainly because "group" seems to be the "world" for the child objects. If I move a plane along the z-axis the plane move along the z-axis of the parent.
I don't understand which coordinates I need to take (or transform) to move the plane bound to "group" in front of the camera.
Basically I demoed with three.js what famo.us did, just spent some two hours on it or so. I faked the wanted effect with an additional plane that is not grouped and which I can just move to camera without transformations. The demo is available here:
http://hwg.rattat.net/famo.html.
Would be nice if somebody could tell me how to get this working. I could still live with the fake, when I would be able to place the additional plane exactly over the selected plane.
Thanks in advance,
Christian
The question of converting local coordinates to world coordinates has been addressed at THREE.js: Calculate world space position of a point on an object . There might also be helping information at how to: get the global/world position of a child object .

THREE.js: Calculate world space position of a point on an object

I have a 3D object. "Attached" to it is a point. When the object is moved or rotated, the point moves and rotates with it.
Given the object's position and rotation, how can the position of the point in world space be calculated? (Using THREE.js's API if possible)
Thanks
For a point in an object's local coordinate system,
object.localToWorld( point );
will return the world coordinates of the point, assuming the same transform is applied to the point as is applied to the object.
three.js r.55

Resources