CODEWITHSUNDEEP
three.js
Hasan
Hasan

Reputation: 2552

How to move and object but keep the child object in the same (world) location

I am trying to find the solution to the question I asked here. I think I achieved the solution by creating and orbit object and inserting the camera as a child object to this one.

I want to be able to move the orbit object but keep the camera in the same world location. I tried this;

this.orbit.position.add(travel);
this.camera.position.sub(travel);

This works perfectly until I do rotation. The fact that my orbit object will have rotation about Z (only Z) axis is making things (world to local conversions) hard for me. and the code above obviously moves my camera to wrong locations.

How can I fix this problem?

Upvotes: 0

Views: 690

Answers (2)

OtterFamily
OtterFamily

Reputation: 803

Glad to see that you solved it, but I thought this might also be interesting for you in the event that things get more crazy -

I saw something in the SceneUtils that might be relevant - the attach/detach function. So you could do something like detach them, do whatever parent independent things you plan to do, then reattach them. This is nice because you can still do parent-y stuff between them, but you can also create blocks where they move in world space, and then reattach without the child moving to worldCoordinates in between.

Upvotes: 1

Hasan
Hasan

Reputation: 2552

So I tried to transform the travel vector by using quartenion of the orbit object:

this.orbit.position.add(travel);    
this.camera.position.sub(travel.applyQuaternion(this.orbit.quaternion));

it did not work...

Since I wasn't sure what quarternions are exactly doing and rotation of orbit is only around Z axis it was quite easy to transform the travel vector to local coordinates as follows:

            this.orbit.position.add(t);

            var angle = -this.orbit.rotation.z;
            var x = t.x * Math.cos(angle) - t.y * Math.sin(angle);
            var y = t.x * Math.sin(angle) + t.y * Math.cos(angle);

            var t2 = new THREE.Vector3(x, y, t.z);

            this.target.position.sub(t2);

And it works like a charm...

Upvotes: 0

Related Questions