set mesh position at intersectionPoint from impl.rayIntersect()

Question

the intersection point from the following method returns a vector that sets the position of the mesh in a different location from where I clicked

`
const intersects = viewer.impl.rayIntersect( rayCaster.ray, true );

  const intPt = intersects.intersectPoint;

  sphereMesh.position.set(
    intPt.x,
    intPt.y,
    intPt.z
  );
  viewer.overlays.addMesh(
    sphereMesh,
    "viewer-scene"
  );

`

I tried using viewer.resize() method and even setting the global offset to 0,0,0 but it doesnt fixed it

Answer 1

Make sure that the ray you're using is setup correctly. It might be pointing in a different direction, hitting different geometry, and therefore returning different intersection points.

I've tried the following code snippet, and the spheres are positioned correctly:

const sphere = new THREE.SphereGeometry(5.0, 8, 8);
const material = new THREE.MeshBasicMaterial({ color: 0x336699 });

NOP_VIEWER.overlays.addScene('spheres');
NOP_VIEWER.container.addEventListener('click', function (ev) {
    const { clientX, clientY } = ev;
    const rect = NOP_VIEWER.container.getBoundingClientRect();
    const result = NOP_VIEWER.hitTest(clientX - rect.left, clientY - rect.top);
    if (result) {
        const mesh = new THREE.Mesh(sphere, material);
        mesh.position.copy(result.point);
        NOP_VIEWER.overlays.addMesh(mesh, 'spheres');
    }
});