How to update createControls's function input variables at javascript?

Question

I have a

 function createControls(){ return new THREE.TrackballControls( camera,domElement );}

which is created with

THREE.TrackballControls=function(object, domElement){.....}
controls = createControls(camera, renderer.domElement);
restoreView(controls, vars);
addDefaultKeyEventListener();

and after resizing the webgl container the controls dont work correct..to be precise there is an event where when the user clicks on the screen a yellow ball moves to the exact place on a plain at the 3d space. After the resize event the ball moves at a spot which has a offset of that place i suppose related with the resized scale. When i try to redefine controls variable it crashes..

How can i update the controls having new camera and renderer.domElement input variables?

also as i see the problem is that the renderer.setSize is changing as the browser window is resized. if i keep the same size it causes distortion to the content. Any help how to fix this? — prieston

Atrahasis Atrahasis · Accepted Answer · 2015-06-30T11:35:48

TrackballControls have a method for that : handleResize(). So if you create your controls with

controls=new THREE.TrackballControls(...);

You just have to add

controls.handleResize();

into the function called at the resize event.

How to update createControls's function input variables at javascript?

1 Answers