Detect cllick on a specific point of a shader material

Helloo, iI’m not sure if my question makes sense or if I’m missing something…
But I was wondering if it’s possible to the detect a click on a shader material plane and where it comes from.
For example, I have a fragment shader with a noise, splitted in different color ranges like this:

 vec3 finalColor;
  if (noise < range1) {
    finalColor = mix(color1.rgb, color2.rgb, noise / range1);
  } else if (noise < range2) {
    finalColor = mix(color2.rgb, color3.rgb, (noise - range1) / (range2 - range1));
  } else {
    finalColor = color3.rgb;
  gl_FragColor = vec4(finalColor, 1.0);

is there a way to detect from js which range is being clicked?
the raycaster only detects clicks on the general mesh, right?
what if I make some vertices higher in order to the color? would it be easier to detect the click?
like this


Maybe GPU picking will help: three.js examples

1 Like