search

jeeliz / jeelizFaceFilter

Javascript/WebGL lightweight face tracking library designed for augmented reality webcam filters. Features : multiple faces detection, rotation, mouth opening. Various integration examples are provided (Three.js, Babylon.js, FaceSwap, Canvas2D, CSS3D...).
https://jeeliz.com
Apache License 2.0
2.69k stars 533 forks source link

FaceFilter face model transparency issue #274

Closed arunscbe closed 2 years ago

arunscbe commented 2 years ago

Hi, While updating the threejs library to R.142, the shadermaterial of the face model becoming black , transparency is not working properly, and have used 2 canvas approach , below image for reference. mask

xavierjs commented 2 years ago

Hi please share your code

arunscbe commented 2 years ago

LINK : https://github.com/arunscbe/capARMask

xavierjs commented 2 years ago

In your main.js, set:

const mat = new THREE.ShaderMaterial({
      vertexShader: vertexShaderSource,
      fragmentShader: fragmentShaderSource,
      transparent: false,
      //flatShading: false,
      uniforms: {
        samplerVideo:{ value: JeelizThreeHelper.get_threeVideoTexture() },
        // videoTransformMat2: {value: spec.videoTransformMat2}
      },
      colorWrite: false
    });

I close the issue since it is not an issue with Jeeliz FaceFilter but with your THREE.js code.