ShaderMaterial don't receive customColor？

Questions
1

“attribute vec3 customColor;”
“attribute float customOpacity;”,
“attribute float customSize;”,
“attribute float customAngle;”,

Vertex shaders don’t receive customColor ，other values(customOpacity……) is ok.
what happend？who could help me？

0

QQ%E5%9B%BE%E7%89%8720190213113036

2

I don’t think you can store colors wherever you are storing them. Did you try just doing three floats?

3

color->float？ RGB to float？ How do I use it?

4

Something like

var myNumber = myColor.r

If you want it in an array you can do this:

var array_of_numbers = [
  myColor0.r, 
  myColor1.g, 
  distance_to_hong_kong
]

function arrayOfColorsToRaw(array){
  const typed = new Float32Array(array.length * 3)
  for( let i = 0, c=0 ; i < array.length; i++){
    typed[c++] = array[i].r
    typed[c++] = array[i].g
    typed[c++] = array[i].b
  }
}
5

attribute vec3 customColor;->attribute float customColorR；attribute float customColorG；attribute float customColorB； this way is ok :rofl:

I don’t understand how vertexAttrib1fv works. and Vertex shaders 's vec3 how to receive ?

6

I don’t understand why you are looking at threes source. There is a higher level api to this.

7

Vertex shaders 's vec3 don’t recevie value.:joy:
in this way:

888
888744×406 6.2 KB

this.particleMaterial.defaultAttributeValues.customColor.value[i] = new THREE.Color({r,g,b}) ; this way is wrong. i dont‘t understand.

8

Do it like so:

var color = new THREE.Color();
var colors = [];

for ( var i = 0; i < positionAttribute.count; i ++ ) {
		
    color.set( 0xffffff * Math.random() ); // generate random color
    colors.push( color.r, color.g, color.b ); // layout is [ r, g, b,  r, g, b,  ... ]
		
}
		
geometry.addAttribute( 'color', new THREE.Float32BufferAttribute( colors, 3 ) );

Array of objects are not supported. You always have to store primitive values in your attribute buffer.

Demo: https://jsfiddle.net/ypsc9m12/1/

9

I don’t think there is a type c or any other type for that matter.

1 Like
10

Yeah, your attribute definitions look strange. Where have you seen this approach?

1 Like
11

in this demo：Particle Engine (Three.js) js:ParticleEngine.js,but it used three version was 60. :laughing: I want to update to the latest version.

12

Ancient history :slight_smile: There is no need for any of that i think, just make your attributes and call them from the shader.