three.js - Why does this ThreeJs plane appear to get a kink in it as the camera moves down the y-axis? -


i have instance of three.planebuffergeometry apply image texture this:

var camera, scene, renderer; var geometry, material, mesh, light, floor;  scene = new three.scene();  three.imageutils.loadtexture( "someimage.png", undefined, handleloaded, handleerror ); function handleloaded(texture) {    var geometry = new three.planebuffergeometry(     texture.image.naturalwidth,     texture.image.naturalheight,     1,     1   );   var material = new three.meshbasicmaterial({     map: texture,     overdraw: true   });   floor = new three.mesh( geometry, material );   floor.material.side = three.doubleside;   scene.add( floor );    camera = new three.perspectivecamera( 75, window.innerwidth / window.innerheight, 1, texture.image.naturalheight * a_bunch );   camera.position.z = texture.image.naturalwidth * 0.5;   camera.position.y = some_int;   camera.lookat(floor.position);    renderer = new three.canvasrenderer();   renderer.setsize(window.innerwidth,window.innerheight);   appendtodom();   animate(); }  function handleerror() {    console.log(arguments); }  function appendtodom() {    document.body.appendchild(renderer.domelement); }  function animate() {    requestanimationframe(animate);   renderer.render(scene,camera); } 

here's code pen: http://codepen.io/anon/pen/qelxvj?editors=001

( note: threejs "pollutes" global scope, use harsh term, , decorates three using decorator pattern--relying on scripts loading in correct order without using module loader system. so, brevity's sake, copy-pasted source code of few required decorators code pen ensure load in right order. you'll have scroll down several thousand lines bottom of code pen play code instantiates plane, paints , moves camera. )

in code pen, lay plane flat against x-y axis, looking straight z-axis, were. then, pan camera down along y-axis, continuously pointing @ plane.

as can see in code pen, camera moves along y-axis in negative direction, texture on plane appears develop kink in around west texas.

why? how can prevent happening?

i've seen similar behaviour, not in three.js, not in browser webgl directx , vvvv; still, think you'll have set widthsegments/heightsegments of planebuffergeometry higher level (>4) , you're set!


Comments

Popular posts from this blog

c++ - Delete matches in OpenCV (Keypoints and descriptors) -

java - Could not locate OpenAL library -

sorting - opencl Bitonic sort with 64 bits keys -