Skip to content


Subversion checkout URL

You can clone with
Download ZIP


camera translateX #1753

farfromrefug opened this Issue · 20 comments

4 participants



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.


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.


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) {

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.


You are right.
But sadly it still doesnt work!


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


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.


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


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


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


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!

@farfromrefug farfromrefug reopened this

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;


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

@mrdoob 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.


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.


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.