Timeline for How do I place an element in front of the camera, facing it regardless of where it is?
Current License: CC BY-SA 3.0
14 events
| when toggle format | what | by | license | comment | |
|---|---|---|---|---|---|
| Sep 5, 2017 at 19:21 | comment | added | Paulo Filho | You were right... subsequent transformations mess up even further. :/ | |
| Sep 5, 2017 at 19:17 | comment | added | OtterFamily | I would be very hesitant to muck around with matrices or quaternions, and would encourage you to figure out how to do this using position and rotation specifically because it's too opaque to easily understand or tweak. | |
| Sep 5, 2017 at 19:12 | comment | added | Paulo Filho | JSFiddle proof: jsfiddle.net/w6sLxwcd/4/embedded/#Result --- since Y axis won't change (it's always "on the ground") it served my purpose for now. :) | |
| Sep 5, 2017 at 19:10 | vote | accept | Paulo Filho | ||
| Sep 5, 2017 at 19:07 | comment | added | Paulo Filho | Found an answer! This ties directly with matrix stuff, which (as you most surely must know by now) I am not good at. I followed an idea from this other SO and somehow it fit the purpose: stackoverflow.com/questions/26910120/… -------------------------------------------- I just did tooltip.object3D.position.applyMatrix4( camera.object3D.matrixWorld ); before doing your suggested lookAt operations and somehow it worked (I'd love to know why though) | |
| Sep 5, 2017 at 18:47 | comment | added | Paulo Filho | Ok, I tried in that order and it shows differently now... I'm thinking there's something to do with rotation. I did: obtain direction by subtracting tooltip position from camera position, normalized this vector, obtained distance from tooltip to camera, multiplied normalized vector by this scalar. It pushed tooltip away somehow. Fiddle proof: jsfiddle.net/w6sLxwcd/3 Image proof: imgur.com/a/a1qgY | |
| Sep 5, 2017 at 17:32 | comment | added | OtterFamily | see previous comment on how to position something between two objects. You know where camera will be and target will be. The tooltip position is then p1-p2 normalized multiplied by your desired tooltip distance plus p2. read above comment | |
| Sep 5, 2017 at 17:29 | comment | added | Paulo Filho | That's where it gets tricky because if I append it as a child it will move with the camera, but I just want the position to be set once. The tooltip will be like a banner that will float in a given position when the camera lands on that position, and that's it. Then, I can rotate to check my surroundings while leaving the tooltip at that place, like a panel. The position and orientation will both be set once, based on camera, and will remain there. | |
| Sep 5, 2017 at 17:24 | comment | added | OtterFamily | if you want it to be stuck to the camera, so that it remains in front of the camera, you can add it to the camera as a child using THREE.Object3D.add(THREE.Object3D). Then the camera moves or rotates, the tooltip will maintain its relationship to the camera | |
| Sep 5, 2017 at 17:22 | comment | added | Paulo Filho | I also wanted to place the tooltip in front of the camera, a few meters way actually ("away" as in a little away but in front of it so the user can see it). I'm sure there's some math involved to be able to get the camera direction and somehow use it in order to place correctly in front of the camera and looking at it (the camera). I'm terribly bad at explaining sorry. | |
| Sep 5, 2017 at 17:20 | comment | added | OtterFamily | to put something between two objects, you get a difference vector which is difference = p1-p2; normalize that vector, multiply it by the scalar distance you want it (either from the camera or from the target object), and then add p2 to it. If you want it fixed distance from the camera, then p2 is the camera. if you want it a fixed distance from the target object, then p2 is the target object. But the question is really unclear, so maybe you want a different behavior | |
| Sep 5, 2017 at 12:55 | comment | added | Paulo Filho | Fiddle: jsfiddle.net/w6sLxwcd/2 relevant code starts at JavaScript line 8. | |
| Sep 5, 2017 at 12:53 | comment | added | Paulo Filho | This worked nearly perfect for me, the only part missing is having the position set up in front of the camera. By this image you can see the tootltip is correctly facing the camera regardless of where the camera is facing (1/3), the tooltip object is also preserving Y axis even if I tilt the camera (2/3); only part missing is positioning, I just tried setting the position but it went awkward: imgur.com/a/p1gN0 | |
| Sep 5, 2017 at 6:54 | history | answered | OtterFamily | CC BY-SA 3.0 |