Incorporating PointLights in Custom Shader Material

Based on your custom shader implementation with THREE-CustomShaderMaterial, I can provide some guidance on incorporating PointLights without using the built-in lighting calculations that come with csm_DiffuseColor.

When working with custom shaders in Three.js, you'll need to manually implement the point light calculations if you want to have precise control over how they affect your toon-shaded material.

Accessing Point Light Data

To access point lights in your shader, you'll need to:

1. Include the relevant Three.js lighting chunks
2. Pass point light information as uniforms
3. Calculate the point light contribution manually

Here's how you might modify your shader:

GLSLCopied
#include <shadowmask_pars_fragment>
#include <lights_pars_begin>

varying vec2 vUv;
varying vec3 vCustomNormal;
varying vec3 vPosition;  // Add this to get fragment position

uniform vec3 colorMap[3];
uniform float brightnessThresholds[3];
uniform vec3 lightDirection;
uniform vec3 lightColor;
uniform float pointLightInfluence;  // Control strength of point lights

void main() {
    float alpha = getShadowMask();

    vec3 cu_normal = normalize(vCustomNormal);
    float brightness = max(dot(vCustomNormal, -normalize(lightDirection)), 0.0);
    
    // Calculate your base color based on directional light
    vec3 finalColor;
    if (brightness > brightnessThresholds[0]) {
        finalColor = colorMap[0];
    } else if (brightness > brightnessThresholds[1]) {
        finalColor = colorMap[1];
    } else {
        finalColor = colorMap[2];
    }
    
    // Calculate point light contribution
    vec3 pointLightContribution = vec3(0.0);
    
    #if NUM_POINT_LIGHTS > 0
    for (int i = 0; i < NUM_POINT_LIGHTS; i++) {
        vec3 lightPos = pointLights[i].position;
        vec3 lightCol = pointLights[i].color;
        float lightDist = length(lightPos - vPosition);
        float attenuation = 1.0 / (1.0 + pointLights[i].distance * lightDist + 
                            pointLights[i].decay * lightDist * lightDist);
        
        vec3 lightDir = normalize(lightPos - vPosition);
        float diffuse = max(dot(cu_normal, lightDir), 0.0);
        
        pointLightContribution += lightCol * diffuse * attenuation * pointLights[i].intensity;
    }
    #endif
    
    // Mix the point light contribution with your toon shading
    vec3 combinedColor = finalColor + (pointLightContribution * pointLightInfluence);
    
    csm_FragColor = vec4(combinedColor * alpha, 1.0);
}

Vertex Shader Modifications

You'll also need to pass the position from the vertex shader:

GLSLCopied
varying vec3 vPosition;

void main() {
    vPosition = (modelMatrix * vec4(position, 1.0)).xyz;
    // Your other vertex shader code...
}

JavaScript Setup

In your Three.js code, make sure to:

1. Set up your point lights
2. Pass the pointLightInfluence uniform to control the strength

JAVASCRIPTCopied
// Create your custom shader material
const material = new CustomShaderMaterial({
    baseMaterial: THREE.MeshStandardMaterial,
    // Your other settings...
    uniforms: {
        colorMap: { value: [color1, color2, color3] },
        brightnessThresholds: { value: [0.8, 0.4] },
        lightDirection: { value: directionalLight.position.clone().negate() },
        lightColor: { value: directionalLight.color },
        pointLightInfluence: { value: 0.5 } // Adjust this value to control point light strength
    },
    // Your vertex and fragment shaders...
});

// Add point lights to your scene
const pointLight = new THREE.PointLight(0xff0000, 1, 100);
pointLight.position.set(10, 10, 10);
scene.add(pointLight);

This approach gives you full control over how the point lights affect your toon-shaded material, allowing you to create a gentle illumination effect without the detailed highlights that come with the standard lighting model.

Remember that you may need to adjust the calculation of the point light contribution to better fit your toon-shading aesthetic, perhaps by applying thresholds to the point light contribution as well.