0

This is probably something simple I'm overlooking. But I'm trying to get the position of an Object3D after panning. I'm using OrbitControls.

I've tried object.position, but the result returned is always the same. This is an example fiddle:

https://jsfiddle.net/jmg157/b9xxdubc/

I tried grid.position, but again, it always returned (0, 0, 0), as I set it initially. I also tried setting an ID for the DOM element (container), and using jQuery's position() method, but no luck with that either.

So if I right click and pan around the grid, how can I get the new position of the grid on the screen (i.e., top, left)?

As always, many thanks!

JoshG
  • 6,472
  • 2
  • 38
  • 61
  • duplicate of http://stackoverflow.com/questions/21557341/three-js-get-world-rotation-from-matrixworld – gaitat Mar 08 '15 at 14:11
  • @gaitat the linked question deals with getting the object's world rotation, I'm looking for object position on the screen. I don't believe these are duplicate questions. – JoshG Mar 08 '15 at 15:23
  • look at the call `mesh.matrixWorld.decompose( position, quaternion, scale );` – gaitat Mar 08 '15 at 16:11

1 Answers1

1

This seemed to do the trick, thanks to the answer of this question: Converting 3D position to 2d screen position [r69!]

I just call this method whenever there is a change in controls (i.e., panning, rotating, etc.) to get the updated position.

function getScreenPosition(object, camera) {

    var vector = new THREE.Vector3();

    var widthHalf = 0.5 * renderer.context.canvas.width;
    var heightHalf = 0.5 * renderer.context.canvas.height;

    object.updateMatrixWorld();
    vector.setFromMatrixPosition(object.matrixWorld);
    vector.project(camera);

    vector.x = (vector.x * widthHalf) + widthHalf;
    vector.y = -(vector.y * heightHalf) + heightHalf;
    return vector;

}

Where left is vector.x and top is vector.y.

Community
  • 1
  • 1
JoshG
  • 6,472
  • 2
  • 38
  • 61