0

Please help me find the normalized screen position forEach Vector3 of my 3D model. I attempted to use the "vector.project(camera)" method to save the projected screen vectors separately, but it doesn't seem to work. I'm using these vectors for camera raycasts.

Codesandbox: code

enter image description here

  • 1
    "it doesn't seem to work" is not enough information. What's the actual issue you're encountering? According to the documentation, [`vector3.project()`](https://threejs.org/docs/#api/en/math/Vector3.project) does exactly what you're trying to achieve. – M - Dec 01 '20 at 00:03
  • I just updated the code to the point where Im stuck. It looks like the vector.project(camera) is modifying the current vector instead of making a copy and saving a new projected vector from the position of the original vector. Its moving the objects instead of just saving the projected vector. So i guess the question is just, " how do I create and save a new projected vector from the original vector, without modifying the current vector?" Thanks for responding. –  Dec 01 '20 at 07:11
  • 1
    There you go, you just figured it out! Instead of using the existing vector, create a new vector, copy the x, y, z values into it, then project it! Vector3.copy() is an easy way to do it. – M - Dec 01 '20 at 07:15
  • I still have the issue where the positions of the objects are repositioned at [0,0,0] from their original position. It's like the projection modifies the original position. And the raycaster.intersectObject() doesnt return anything. –  Dec 01 '20 at 07:47

1 Answers1

0

Ok, this is what you're doing now:

// Calling project() on the object's position changes its value
const vector = ref.current.position.project(camera);
const projVec = new THREE.Vector3(vector.x, vector.y, vector.z);

As we discussed in the comments, calling .project() on a vector will reset it in the [-1, 1] range. That's what the documents describe. So when you take the position of the model, and call project(), you're changing its position to somewhere within the [-1, 1] range!

Like I suggested, you have to create a new vector, then call project on the new vector, not on the object's position:

// Create new vector
const projVec = new THREE.Vector3();

// Copy the object's position into new vector
projVec.copy(ref.current.position);

// Perform projection on NEW vector
projVec.project(camera);

// Now we have a vector in screen-space [-1, 1] range
console.log(projVec);
M -
  • 26,908
  • 11
  • 49
  • 81