In my tool that I am making using ThreeJs, I have an additional javascript functionality which is generating some variables (not fixed length), it could a single floating number or multiple that can be stored in an array and then I want to pass those variable to FRAGMENT SHADER code.
I know I can use in the form uniform float ### or uniform vec3/vec4 ###
So what I am doing is selecting a region with my mouse in my Javascript-based functionality and passing that information to Shader to have the same selection.
I can’t understandad this question very clearly. If you want to pass uniforms to shaders from js code, you can make a ShaderMaterial with your own shader. Define uniforms in the material, and assign the uniform values by myShaderMaterial.uniforms.myVariable.value = myValue.
Yes, I know this way of passing. But in my case the variable length is not fixed; this is where the problem is. Sometimes it might be an array of length 7 or sometimes it might be of length 12. As far as I know, we cannot assign the uniform variable something dynamic. We have to initialize it with the number of variables we are passing through.
Do you mean that your variable is an array? I have no experience on this, but it makes me think of lights. In fragment shader, we can get PointLight like this:
uniform PointLight pointLights[NUM_POINT_LIGHTS];
PointLight pointLight
for ( int i = 0; i < NUM_POINT_LIGHTS; i ++ ) {
pointLight = pointLights[ i ];
}
It seems like that Three.js pass the lights by an array as this article said. Three.js has their way to create NUM_POINT_LIGHTS, I think you can create ARRAY_LENGTH dynamically too. But I don’t know how.
