Merging five geometries in version 150

Merging five geometries in version 150

Hi Three.js followers,

Please write me if is there a simple way to set color attributes for each geometry.

the link:

Again, Thanks for the great Three.js Team!

José Roberto Lazzareschi


1 Like

Simply save the information about geometry vertices to any structure you comfortable with and use it to color a specific part.

I used an array of objects {start: _number_, count: _number_} in mesh.userData.gIndex. Pretty similar to groups, the difference is there’s the count for vertices only, no matter what geometry it is, indexed or non-indexed:

1 Like

Thank You very much for the attention.
I will study your code. :wink:

Dear Paul,
I confess that I have difficulty with functions like => {…}
So I stopped and thus could not understand the way in which you created the geometries.
But there must be a way to create geometries one by one, in a way that I can understand and get the same color changes.
Thank You anyway once again!

No problem. I modified that codepen, turned arrow expressions into functions and for-loops :slight_smile:

1 Like

Although arrow-functions may be hard to read/grasp at first, they have a significant benefit over regular functions. Most notably is that they don’t have/create a scope, which may give a performance benefit.

The easiest explanation is that anything after => is considered a return value, meaning that this:

const myFunc = () => 42;

is the same as this:

const myFunc = function () { return 42; }

A little ‘gotcha’ that explains the scoping benefit a bit more: Imagine having a class that has some properties. You’re writing a method in said class and want to access a property of the class from inside a forEach-callback. With regular functions, you would do something (hacky) like reassign the this variable to a temporary variable (called that):

class MyClass
    #somePrivateValue = 42;

        const that = this;

        myArray.forEach(function() {
            // "this" refers to the inner-scope of this "function", rather 
            // than the class instance. We'll have to use another variable
            // to access the class instance.

        myArray.forEach(() => {
            // This just works, beacuse "() => {}" does not create a scope,
            // meaning "this" is still an reference to the class instance.

You are really a special person…
Thank You once and twice again.
I will study it again! :smiley:

1 Like

Thank You Harold for the lesson…
I will take a great look at the code to find a way to learn it. :wink:

1 Like

A modified code where I could start to understand what is necessary to make the things happen: