scene complete cellShading

[Dad72]

Hello, I would like to use the shader cellshading but full on scene for not applying the shader object by object. Is possible. how?

 

Thank you for the help.

[GameMonetize]

WHat about a postprocess in this case?

[Dad72]

Ah yes, postProcess would be fine, but how can I do?

[GameMonetize]

Create custom postprocess:

https://github.com/BabylonJS/Babylon.js/wiki/How-to-use-postprocesses

 

THen you have to find a cellshading shader code

[Dad72]

Ok, I think I understand. I'll try and experiment with my first custom postproccess. 

 

Thank you DK

[Dad72]

I try, but it does not work, What am I doing wrong or what did I forget?

 

in the console I:

 

- Unable to compile effect: [object Object]

- Defines:

- Error: Varyings with the same name but different type, or statically used varyings in fragment shader are not declared in vertex shader: vPositionW
 
PostProcess :

var postProcess0 = new BABYLON.PassPostProcess("Scene copy", 1.0, this.camera);this.postProcess = new BABYLON.PostProcess("cellShading", "./Data/Shaders/cellShading", ["world", "worldViewProjection"], ["textureSampler"], 0.25, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, this.engine, true);this.postProcess.onApply = function (effect) {    effect.setTextureFromPostProcess("textureSampler", postProcess0);    effect.setVector3("vLightPosition", this.LightDirectional[0].position);    effect.setFloats("ToonThresholds", [0.95, 0.5, 0.2, 0.03]);    effect.setFloats("ToonBrightnessLevels", [1.0, 0.8, 0.6, 0.35, 0.01]);    effect.setColor3("vLightColor", this.LightDirectional[0].diffuse);};

Shader:  ./Data/Shaders/cellShading.fragment.fx

#ifdef GL_ESprecision mediump float;#endif// Lightsvarying vec3 vPositionW;varying vec3 vNormalW;varying vec2 vUV;// Refsuniform float ToonThresholds[4];uniform float ToonBrightnessLevels[5];uniform vec3 vLightPosition;uniform vec3 vLightColor;uniform sampler2D textureSampler;void main(void) {	// Light	vec3 lightVectorW = normalize(vLightPosition - vPositionW);	// diffuse	float ndl = max(0., dot(vNormalW, lightVectorW));	vec3 color = texture2D(textureSampler, vUV).rgb * vLightColor;	if (ndl > ToonThresholds[0]) {		color *= ToonBrightnessLevels[0];	}  else if (ndl > ToonThresholds[1]) {		color *= ToonBrightnessLevels[1];	} else if (ndl > ToonThresholds[2]) {		color *= ToonBrightnessLevels[2];	} else if (ndl > ToonThresholds[3]) {		color *= ToonBrightnessLevels[3];	} else {		color *= ToonBrightnessLevels[4];	}		gl_FragColor = vec4(color, 1.);} 

Thank you

[GameMonetize]

This is not a postprocess shader but more a material shader

Using a postprocess you cannot receive vPositionW or vNormalW because you are working on a 2D space (The postprocess is applied as a post treatment over the final rendering)

[Dad72]

Ah, the I'm lost. there shaders for materials and one for post processing. I do not see the difference in code when I look at the examples in the wiki. and where can we find this kind of shader?

Thank you

[Dad72]

I'll drop it, it's too complex for me and I do not want to spend three months. I will rather play with textures and lighting effects for a result more drawing.

 

[edit] I try to make an impact on the images directly and color adjustment on the lights and the result is satisfactory and it is easier than doing postprocessing.