Shader material with morph targets

I tried to use shadermaterial with morph targets, with shadermaterial I just want to change the look of the object,not its geometry. I have not been successful in doing that. The morph targets stop working if I use shadermaterial . Is this a bug? how can I get away with this …

I have not found any solution or question asked about this

I used this vertex shader before

'varying vec2 vUv;\
		uniform float morphTargetInfluences[ 8 ];\
		void main() {\
			vUv = uv;\
			vec3 morphed = vec3( 0.0 );\
			\n#ifdef USE_MORPHTARGETS\n\
			morphed += ( morphTarget0 - position ) * morphTargetInfluences[ 0 ];\
			morphed += ( morphTarget1 - position ) * morphTargetInfluences[ 1 ];\
			morphed += ( morphTarget2 - position ) * morphTargetInfluences[ 2 ];\
			morphed += ( morphTarget3 - position ) * morphTargetInfluences[ 3 ];\
			morphed += ( morphTarget4 - position ) * morphTargetInfluences[ 4 ];\
			morphed += ( morphTarget5 - position ) * morphTargetInfluences[ 5 ];\
			morphed += ( morphTarget6 - position ) * morphTargetInfluences[ 6 ];\
			morphed += ( morphTarget7 - position ) * morphTargetInfluences[ 7 ];\
			\n#endif\n\
			morphed += position;\
			gl_Position = projectionMatrix * (modelViewMatrix * vec4( morphed, 1.0 ));\
		}'

these days it might need few tweaks (edit: specifically, after this pull request)

can you share the whole code?

if you do jsfiddle with MeshBasicMaterial, I could edit it

Actually, someon posted this:
Edit fiddle - JSFiddle - Code Playground

Fixed my shader issue, but i cannot use the Morphtargetinfluences for some reason, it seems a recurrent issue

Been trying using morphTargetinfluences, to no avail, what am i getting wrong?


const vShader = `
      attribute float size;
      varying vec3 vColor;
      uniform float morphTargetInfluences[ 5 ];
       #include <morphtarget_pars_vertex>

      void main() {
         #include <begin_vertex>
        #include <morphtarget_vertex>
        vec3 morphed = vec3( 0.0 );
    #ifdef USE_MORPHTARGETS
      transformed  += morphTarget0  * morphTargetInfluences[ 0 ];
      transformed  += morphTarget1  * morphTargetInfluences[ 1 ];
      transformed  +=  morphTarget2   * morphTargetInfluences[ 2 ];
      transformed  +=  morphTarget3   * morphTargetInfluences[ 3 ];

      #endif

      vec4 mvPosition = modelViewMatrix * vec4( transformed, 1.0 );
      gl_PointSize = size   ;
      gl_Position = projectionMatrix * mvPosition;

          // gl_Position = vec4( transformed, 1.0 );

   }`

const fShader = `
      uniform vec3 color;
      uniform float alphaTest;
      uniform vec2 u_resolution;
      varying vec3 vColor;

      void main() {
      vec2 xy = gl_PointCoord.xy - vec2(0.5);
      float ll = length(xy);
      gl_FragColor = vec4(color * 10.0 , step(ll, 0.5 ) * alphaTest);
       
   }`


    const shaderMat = new ShaderMaterial( {

        uniforms: {
            color: { value: new Color( 0xffffff ) }, // pointTexture: { value: new THREE.TextureLoader().load( 'textures/sprites/disc.png' ) },
            alphaTest: { value: 0.025 } ,
            size: { value: minScale   },
            scale: { value: 1 },
            morphTargetInfluences: {value: [1.0, 0.0, 0.0, 0.0, 0.0]}

          },
            vertexShader: vShader,
            fragmentShader: fShader,
            blending: AdditiveBlending,
            depthTest: false,
            transparent: true,
             morphTargets: true
            //, lighting : true

        } );

      shaderMat.morphTargets = true;
        
 shaderMat.uniforms.morphTargetInfluences  =  group.children[0].morphTargetInfluences

from your shader you seem to have Points not Mesh, and I dont think morph targets are supported there. if so, you have to declare attributes manually and morph them by hand as well. scratch that, they are supported

yes, they are. My issue laid in the geometry :sweat_smile:, I have posted the code here: