Feature: Unique colors for InstancedMesh

4 thoughts on “Feature: Unique colors for InstancedMesh”

1. On the r.113dev branch:
   https://raw.githack.com/mrdoob/three.js/dev/examples/webgl_instancing_modified.html

2. Alternatively, without a custom shader:

   three.js/examples/webgl_instancing_scatter.html

   Lines 82 to 98
   in
   4541808

   	// Assign random colors to the blossoms.
   	var _color = new THREE.Color();
   	var color = new Float32Array( count * 3 );
   	var blossomPalette = [ 0xF20587, 0xF2D479, 0xF2C879, 0xF2B077, 0xF24405 ];
   	for ( var i = 0; i < count; i ++ ) {
   	_color.setHex( blossomPalette[ Math.floor( Math.random() * blossomPalette.length ) ] );
   	_color.toArray( color, i * 3 );
   	}
   	blossomGeometry.setAttribute( ‘color’, new THREE.InstancedBufferAttribute( color, 3 ) );
   	blossomMaterial.vertexColors = THREE.VertexColors;
   	stemMesh = new THREE.InstancedMesh( stemGeometry, stemMaterial, count );
   	blossomMesh = new THREE.InstancedMesh( blossomGeometry, blossomMaterial, count );

3. @donmccurdy You can change the example if you want. I thought it would be nice to show how to hack the shader, though. Adding instanced color seemed to be a good option at the time. 🙂

4. @WestLangley @donmccurdy sorry to bother you guys again but this is what you helped me out with Matrix Body Simulation. Again, thank you so much. 🙏

Comments are closed.