CODEWITHSUNDEEP
three.js
JoshG
JoshG

Reputation: 6745

Getting position of Object3D after panning

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!

Upvotes: 0

Views: 381

Answers (1)

JoshG
JoshG

Reputation: 6745

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.

Upvotes: 1

Related Questions