Custom geometry with additional data on shader

Please excuse me but I am pretty new and trying to figure something out and was hoping someone here could point me in the right direction.

I want to have a reusable raw shader material where I render different geometries performantly.
The geometry data includes.
Vertex position
UV

The geometry is in essence a composite of planes numbering from 1:N
So this batch of planes also has additional context data that must be passed to the fragment shader.
Each plane will have different values.

So lets say I have a batch of 5 planes.

  1. Define the vertex data for the planes
  2. Define the face data for the planes
  3. Define the UI data for the planes

Lets say that per plane I also want to send a “aspect” value to the shader.

Q1: How can I define the aspect value per plane and pass that on the raw shader material.
Q2. In the material how can I access that value per plane

If your planes would be independent instances of THREE.Mesh, you could assign a unique material per plane and define object data as uniforms. However, this means you need one draw call per plane which is problematic if you are going to have a lot of them.

Since you are using a single geometry, you have to control data of planes as additional vertex attributes. Keep in mind that the vertex shader has no concept of faces. It only knows vertices. So in your case, you define the aspect for each vertex. All vertices of a specific plane have the same value.

If the basic geometry data of your planes are equal (e.g. number of vertices and attributes), consider to use instanced rendering and define the instance specific data as instanced attributes (instead of normal buffer attributes).

In instance mesh I know you can set stuff like position and color but I would like to pass on a float value per instance that I can pick up in the shader.

So lets say I have a value called “ratio” that is different per instance.
Am I able to set that attribute per instance?

Each plane also has a different size and UV.
Can you still use instance mesh in this case?

I believe you may be interested in “attributes” of a geometry.

Say you have N planes in one geometry, and say you are using a triangle soup, each plane could have 2 triangles and thus six vertices. If you want to call that “plane 0” you could add [0,0,0,0,0,0,0] in another attribute and call that “planeIndex”, for the next 6 vertices representing another plane you would add [1,1,1,1,1,1,1] and so forth.

From here, you can use these, to for example lookup a pixel from a texture containing some data, or, instead of writing the index, you could actually write your data in the attribute.

If you are using instancing, there is no need to repeat these values, you would use an instanced attribute and just one value per instance.

Is there a example that you know of that I can perhaps look at?