How do I change a IcosahedronGeometry object's face with a click?

Questions
1

I’m learning three.js but I’m discovering that most questions on the internet were asked years ago and are no longer relevant for the version I’m using. I’m also unfamiliar with geometry or 3D modeling.

I’m trying it out on my website at this page: Question for three.js
The JS is here: https://llmpeeters.com/js/question.js
I put a MeshStandardMaterial map (an image I loaded) on a IcosahedronGeometry.
When I use THREE.REVISION I get 126. For the sake of archiving, i uploaded the two files as they are right now.

My desired effect is that when I click, it will change the color of the face that I’m clicking.

Edit: I forgot to add that the radius of the object is set with a formula but that’s for unrelated reasons. Unaltered OrbitControls were also added.

question.php (570 Bytes) question.js (2.3 KB)

2

Try it with this code: https://jsfiddle.net/fg4y3wLa/

You have to enhance the instance of IcosahedronGeometry with a vertex color attribute and then modify the colors for all vertices of a clicked face.

4 Likes
3

Thank you very much, this totally did what I wanted it to do. I also think I accidentally unclicked Solution because I thought it was unclicked.