#looking for alternatives to gl_Position for this shader

18 messages · Page 1 of 1 (latest)

glass lynx
#

how can i write this without; ' gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);', uncommenting it break my animations.
how can i make the shader update the colour with the normals being relative to the world?
https://jsfiddle.net/lunchie/xwa47u0t/1/

skinnedMesh.material = new THREE.ShaderMaterial( {
    vertexShader: [
          '#include <skinning_pars_vertex>',
          'varying vec3 vNormal;',

          'void main() {',

            '#include <skinbase_vertex>',
            '#include <begin_vertex>',
            '#include <skinning_vertex>',
            '#include <project_vertex>',

            '       vNormal = normal;',
      //    '       gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);',
          '}'
           ].join( '\n' ),
           fragmentShader: [
             'varying vec3 vNormal;',
             'void main() {',
             '       gl_FragColor = vec4(abs(vNormal), 1.0);',
             '}'
           ].join( '\n' ),
         skinning: true
    } );

i may be using words incorrectly, visually what i want the shader to look like there is a blue light shining on the model from x = -1, and x = 1 , a red light from z = -1,and z = 1 , and a green light from y = -1,and y = 1

chatGTP is sujesting to use things like gltf.parser.json.vendortexture or extras is that is that worth looking into? my model dosent have those properties. (also looking for a better way to phrase this question)

plucky jolt
#

vNormal = normalMatrix * normal; would give you world-space normals.

glass lynx
#

thats a step in the right dirrection, how can i get it to update every frame?

glass lynx
#

for example; if the stormtrooper bows the color on top of the head should change from blue to green

plucky jolt
#

So the normals aren't reflecting the skinned animations?

#

I'll see how three is otherwise doing that.

glass lynx
#

in the jsfiddle example the top of his arms is red and should be blue when holds them out dancing. im using a glb in my full script that keeps the colors from the t pose when it loads when the model turns left and right; green and red should rotate around the model right now it's static

#

the bottom of his feet should turn red (or green if hes facing down y = -1 or y =1) when he lifts them.

#

i think the the answer to your question is 'yes' but i dont know what im talking about

plucky jolt
#

This looks to be correct, but I'd double check with your implementation.

#include <skinning_pars_vertex>
varying vec3 vNormal;

void main() {
  #include <skinbase_vertex>
  #include <begin_vertex>
  #include <skinning_vertex>
  #include <project_vertex>

  mat4 skinMatrix = boneMatX * skinWeight.x + boneMatY * skinWeight.y + boneMatZ * skinWeight.z + boneMatW * skinWeight.w;
  vNormal = (skinMatrix * vec4(normal, 0.0)).xyz;
}
glass lynx
#

thats a leap in the right dirrection and just what i asked for, thank you! i imediatly ran into another unrelated problem but ill dig into it a bit first

plucky jolt
#

If the normals aren't correct or inverted, you can try against the inverse transpose of the skin transforms: vNormal = mat3(inverse(transpose(skinMatrix))) * normalMatrix * normal;. IIRC, this should combine skinning and three.js transforms.

glass lynx
#

i have a lot of reading to do at this point, a fair bit of this has gone over my head, im getting ERROR: 0:104: 'transpose' : no matching overloaded function found , ERROR: 0:104: 'inverse' : no matching overloaded function found

plucky jolt
#

Your version of three.js is likely too old since that's a WebGL 2 feature.

#

That effectively reflects skinMatrix so normals are oriented correctly. normalMatrix would otherwise be mat3(inverse(transpose(modelViewMatrix))) which describes a rotation.