ThreeJS: Weird object clipping in Chrome for Android -
i have "2d" scene (z pointing up) plane geometry game arena set this:
var arenamesh = new three.mesh( new three.planegeometry(scenewidth, sceneheight), new three.meshlambertmaterial({ map: arenatexture, emissive: 0xffffff })); arenamesh.position.x = scenewidth / 2; arenamesh.position.y = sceneheight / 2; arenamesh.position.z = 0; arenamesh.receiveshadow = true; the game object set (a flat box):
var size = 20; var bodymesh = new three.mesh( new three.boxgeometry(size, size, 0.01), new three.meshlambertmaterial({ map: bodytexture, alphatest: 0.65, emissive: 0xeeeeee })); bodymesh.position.x = x0; bodymesh.position.y = y0; bodymesh.position.z = 5.0; bodymesh.castshadow = true; i'm using boxgeometry here due shadow problems had before.
now, problem works fine on desktop (ff , chrome): fake 2d game object rendered , casts shadow on game arena. however, on nexus 7 can see shadow of object! after debugging, noticed if set z-position of game object bigger value, z=15.0 gets rendered. unfortunately not acceptable, because object seems it's flying. lowering game arena plane e.g. z=-15.0 has same effect. heck cause this? seems precision somehow lost there. why shadow still there correctly?
based on comments added question, solution problem set znear higher value. apparently ratio of znear , zfar affects precision of z-buffer , fixes problems on nexus 7.
Comments
Post a Comment