Three.js ShaderMaterial with lights on mesh imported from Blender -


i'm trying shadermaterial lights working in three.js r77. works correctly when applied mesh simple boxgeometry behaves incorrectly when applied mesh imported blender.

a simple jsfiddle illustrating problem here. mesh on left created blender export. mesh on right created simple boxgeometry. both using same shadermaterial. position of light indicated directionallighthelper.

the mesh on right being lit correctly, while mesh on left not. problem in shader code. assumed problem in uv map on imported mesh, not appear true. in jsfiddle example uv map copied directly boxgeometry mesh imported geometry---they're rotated relative each other because of coordinate differences between blender , three.js, lighting still working correctly on mesh on right imported uvs.

the shader code is:

three.testshader = {   uniforms: {     "udirlightpos": {       type: "v3",       value: new three.vector3(20, 20, 20)     },     "udirlightcolor": {       type: "c",       value: new three.color(0xffffff)     },     "utexture": {       type: "t",       value: null     },   },   vertexshader: [     "varying vec3 vnormal;",     "varying vec3 vviewposition;",     "varying vec2 vuv;",     "void main() {",     "vuv = uv;",     "vnormal = normalize(normalmatrix * normal);",     "vec4 mvposition = modelviewmatrix * vec4(position, 1.0);",     "vviewposition = -mvposition.xyz;",     "gl_position = projectionmatrix * modelviewmatrix * vec4(position, 1.0);",     "}"   ].join("\n"),   fragmentshader: [     "uniform vec3 udirlightpos;",     "uniform vec3 udirlightcolor;",     "varying vec2 vuv;",     "varying vec3 vnormal;",     "varying vec3 vviewposition;",     "varying vec4 mvposition;",     "uniform sampler2d utexture;",      "void main() {",     "vec4 ldirection = viewmatrix * vec4(udirlightpos, 0.0);",     "vec3 lvector = normalize(ldirection.xyz);",     "vec3 normal = normalize(vnormal);",     "float diffuse = dot(normal, lvector);",     "vec4 texel = texture2d( utexture, vuv );",     "gl_fragcolor = vec4(udirlightcolor * diffuse, 1.0) * texel;",     "}"   ].join("\n") }; 

in addition solution particular problem, pointer better documentation on three.js shader stuff appreciated. official documentation shaderchunk, shaderlib, , uniformslib not you'd call exhaustive.

your blender-exported model has incorrect normals.

vnh1 = new three.vertexnormalshelper( mesh1, 1, 0xff0000, 1 ); scene.add( vnh1 ); 

fiddle: https://jsfiddle.net/5j0axcgz/1/

three.js r.77


Comments

Popular posts from this blog

sequelize.js - Sequelize group by with association includes id -

android - Robolectric "INTERNET permission is required" -

java - Android raising EPERM (Operation not permitted) when attempting to send UDP packet after network connection -