I have a 3D object loaded with gltf loader. I have two points in my screen A, B. I need to put my 3D object in between these two points such that two of my 3D models point always map to these two points in the screen. The points in the screen are dynamic(continuously updating their position keeping a constant distance).
Assuming you have points A and B in world space, you can compute the midpoint like so:
const midpoint = new THREE.Vector3();
midpoint.addVectors( A, B ).divideScalar( 2 );
Positioning the glTF asset at that point should solve your issue (assuming the glTF asset is properly centered in the first place).
Hi, how it will solve the problem? My target is not only setting the gltf at the mid point of A,B rather to set it somewhere between A,B such that two specific points of the GLTF meets A, B respectively. And also there is scaling factor, my size of gltf, and the distance between A,B is not same. I need to scale the gltf as well. There is rotation involves as well. A, B are continuously updating their position, so they may have a certain anglr between them. Lets say may gltf is a front view of a human. I want to position the left eye of the human to point A and ankle of the human to point B. And as it is the front vew, so the rotation of the human body is along z axis. Sometimes the feet seems closer to screen and head leans back, and sometimes head leans forward and feet goes back, something like that.
Are you talking about 2d screen points that you want to unproject out into 3d world vectors like this Project a 2D screen point to 3D world point and How to set 3d geometry position by 2d screen pos? Also check out the source code for picking to see how to convert 2d mouse points into 3d rays.
If not, could you give more information about what you are trying to do or demonstrate with a live example?
I am sorry may be I have made you confuse using the term ‘screen’. I have two points in world coordinates A, B. Lets say I have a 3D model of a human looking at right side.(i mean right side of the screen, showing a side view of the human). Now I want:
- First roatate the human gltf such that it looks front, giving a front view of the human.
- I want to position this human gltf in sucha way that the eye of the model meets at point A and the ancle of the human body meets at point B.
- The model rotates to and fro like a cradle, I mean the point A, B actually moves like that, so the human gltf will also move like that. Like point A is going far and point B is coming near and vice versa.
I dont have have the human gltf model yet. For understanding I will create a demo with some other model may be. But I dont know that Will help to clarify my problem or not. I can draw a picture and share instead to visualize the thing.
Lets make it simpler. Forget mapping object with screen points A, B. It is simple if we think like this,
I know world coordinates of 2 points of the object. Suppose the object is a human body. So i know the coordinates of the eye, and the coordinates of the knee in world space. Now I want to place the human object in the scene.
If the model is supposed to bend within constraints, like a human, with the knee and eye following moving points in the world, maybe inverse kinematics will help.
I saw a demo last week of a character sitting in a chair drinking tea and the user could move the cup around and the arm would follow; maybe someone else will remember where that is.