Skip to content


Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP


camera translateX #1753

farfromrefug opened this Issue · 20 comments

4 participants

Martin Guillon Mr.doob Derek Wright AlteredQualia
Martin Guillon


I am trying to implement translation using pan on ipad. So when the user pan on the ipad, i want to translate the camera. Actually what i want is to translate the camera in the global space like if i had translated the camera of panx, pany in its own space.

I am not sure if it the right function to use, but i understood translateX, translateY to be what i want. So the first question is "am i right?"

Now the reason why i ask, and not just test it, is that for me translateX on the camera does nothing.


i tried updating the matrix afterward, still nothing :s
By the way i actually use CombinedCamera, and so i do


I am not sure if it the right function to use, but i understood translateX, translateY to be what i want. So the first question is "am i right?"

Yep. That should be working.

Martin Guillon

Ok so that s a good news but it doesnt work :s
I tried updateMatrix afterward and still nothing ...


Could you share more code? It may just be something else.

Martin Guillon

I hope you have enough. And by the way, thank you!

RepairMan.loadDAE = function(path)
    if (dae != null)
        dae = null;
    loader.load( path, function colladaReady( collada ) {

        dae = collada.scene;

        dae.scale.x = dae.scale.y = dae.scale.z = 0.002;
        dae.useQuaternion = false;

        THREE.SceneUtils.traverseHierarchy( dae, function ( object ) {
            partsDict[] = object; 
            object.material.doubleSided = true;
            object.useQuaternion = false;
        } );
        scene.add( dae );
    } );
var init = function() {
    projector = new THREE.Projector();

    scene = new THREE.Scene();

    camera = new THREE.CombinedCamera(window.innerWidth,  window.innerHeight, initialCamera.fov, 1, 2000 );
    camera.position.set( initialCamera.tx, initialCamera.ty, );
    camera.useQuaternion = false;
    camera.lookAt( scene.position );

    scene.add( camera );

    // RepairMan.loadDAE(decodeURIComponent("/Volumes/data/dev/xerox/xstar3/trunk/Client/Titanium/RepairMan/Resources/web/models/main.dae"));

    scene.add( new THREE.AmbientLight( 0xcccccc ) );

    var directionalLight = new THREE.DirectionalLight(0xaaaaaa );
    directionalLight.position.x = 100;
    directionalLight.position.y = 100;
    directionalLight.position.z = 100;
    scene.add( directionalLight );

    var directionalLight2 = new THREE.DirectionalLight(0xaaaaaa );
    directionalLight2.position.x = -100;
    directionalLight2.position.y = -100;
    directionalLight2.position.z = -100;
    scene.add( directionalLight2 );

    renderer = new THREE.WebGLRenderer();
    renderer.setSize( window.innerWidth, window.innerHeight );
    document.body.appendChild( renderer.domElement );

    stats = new Stats(); = 'absolute'; = '0px';
    document.body.appendChild( stats.domElement );;
RepairMan.moveModel = function(_x, _y, _z, _animated) {
Derek Wright

Looking at the source - it seems you should be translating the CombinedCamera object as it is the render-time camera being used. The 2 children camera seems to be used to setup the parent camera parameters.

Martin Guillon

You are right.
But sadly it still doesnt work!


Have you tried using PerspectiveCamera instead? Is there any reason why you need CombinedCamera?

Martin Guillon

I use CombinedCamera because it has methods like setZoom which make it pretty nifty with touch screen pinch for example.
But i can try PerspectiveCamera and add the setZoom if it works for translateX.


Looking at the CombinedCamera code...

this.cameraP.fov =  this.fov / this.zoom;

Seems like you can just try using the PerspectiveCamera and do this:

camera.fov = fov / zoom;

Then try and see if translateX() works.

Martin Guillon

still doesn't work :s
I must be doing something wrong!


Uhm... do you mind creating a jsfiddle that shows the issue?

Martin Guillon

it works on jsfiddle
so its definitively me :s
sorry for the trouble, will go through my code (again)

Martin Guillon

Ok so i managed to get to work (dont really now how but i guess it was a FULL clean up of the project)
Thank you!

Martin Guillon farfromrefug reopened this
Martin Guillon

Ok so i faced the problem again. And i managed to narrow it down to Vector3.addSelf
It's camera.position.addSelf( axis ); which doesnt work in my case.
The worst part is that if i do

camera.position.x += axis.x;
camera.position.y += axis.y;
camera.position.z += axis.z;

it works....
any idea?


No idea...

    addSelf: function ( v ) {

        this.x += v.x;
        this.y += v.y;
        this.z += v.z;

        return this;

Martin Guillon

Yes me neither, i tried a lot of things and i dont get it...
So for now i stick with my solution (ugly one ...)

Mr.doob mrdoob closed this

This is weird, maybe some trouble with runaway global variables or accidentally naming more variables with the same name or something like that.

Martin Guillon

what is "runaway global variables"?


When you think your variable is local but you accidentally made it global because of some mistake, e.g.:

function doSomething() {

    var localVar1; // <== here


We used to have some really strange bugs cause of this.

Martin Guillon

ah ok i see.
I will go through my code to check that, we never know!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.