Three.js resize window not scaling properly -

when resizing window, shape not scale properly.

i'm using following code , according documentation, should fine.

var camera, controls, scene, renderer, viewsize;         scene = new three.scene(); scene.background = new three.color( 0xffffff ); viewsize = 20; var aspectratio = window.innerwidth / window.innerheight camera = new three.orthographiccamera( -aspectratio * viewsize /  2, aspectratio * viewsize / 2, viewsize / 2, -viewsize /  2, 0.1, 1000 ); camera.position.x = 10; camera.position.y = 10; camera.position.z = -10 camera.lookat(scene.position);  renderer = window.webglrenderingcontext ? new three.webglrenderer() : new three.canvasrenderer(); renderer.setsize( window.innerwidth, window.innerheight ); document.body.appendchild( renderer.domelement );  controls = new three.orbitcontrols( camera , renderer.domelement);  window.addeventlistener( 'resize', onwindowresize, false );  function onwindowresize() {   camera.aspect = window.innerwidth / window.innerheight;   camera.updateprojectionmatrix();   renderer.setsize( window.innerwidth , window.innerheight); }  makeshapes();  var render = function () {   requestanimationframe( render );   renderer.render(scene, camera); };  render(); 

as seen on image above, shapes dragged out when window gets bigger , vice versa.

try this:

var w = window.innerwidth; var h = window.innerheight; var viewsize = 20;  var camera, scene, renderer;  camera = new three.orthographiccamera( w / - 2 * viewsize, w / 2 * viewsize, h / 2 * viewsize, h / - 2 * viewsize, 0.1, 1000 ); camera.position.set( 10, 10, -10 ); camera.lookat( scene.position );  renderer = window.webglrenderingcontext ? new three.webglrenderer() : new three.canvasrenderer(); renderer.setsize( window.innerwidth, window.innerheight ); document.body.appendchild( renderer.domelement );  window.addeventlistener( 'resize', onwindowresize, false );  function onwindowresize() {     w = window.innerwidth;     h = window.innerheight;     camera.left = w / - 2 * viewsize;     camera.right = w / 2 * viewsize;     camera.top = h / 2 * viewsize;     camera.bottom = h / - 2 * viewsize;     camera.updateprojectionmatrix();     renderer.setsize( w, h ); }