Is ThreeJS object hierarchy documented anywhere?

Questions
1

Hello,

I am using the code below but position is not a recognized property of :

geometry = new THREE.PlaneBufferGeometry(2000, 2000, 200 - 1, 200 - 1);
geometry.attributes.position.needsUpdate = true;

I probably need to cast geometry or geometry.attributes into something else like:
(<SomeClass?>geometry).attributes.position.needsUpdate = true;
or
(<SomeClass?>geometry.attributes).position.needsUpdate = true;

but I cannot figure what Class or Interface to use for SomeClass.

It would be really nice to have the ability to filter ThreeJS classes on the search based on existence of a property or method.

Last but not least is ThreeJS object hierarchy documented as a hierarchy diagram or an expanded explorer view, anywhere?

1 Like
2

Not sure why you’re setting needsUpdate to true right after creating the geometry. It doesn’t need that upon creation, only after you’ve made changes to the values in the position array.

I probably need to cast geometry or geometry.attributes into something else

What makes you say that? Are you getting any errors or undesired behavior? Also, you didn’t mention it, but it looks like you’re using TypeScript, correct?

To answer your question, there is no hierarchy outline in the docs that I know of, but you can follow the hierarchy by looking at the top link of each page. PlaneBufferGeometry is a subclass of BufferGeometry, which has a .getAttribute method, which gives you a BufferAttribute object. You should probably use .getAttribute("position") instead of directly accessing .attributes.

3

@marquizzo
I am using r104 and yes project is in TypeScript.
About the two lines above you are correct those are not side by side.
Instantiation (1st line) is done in constructor while the update to .needsUpdate (2nd line) is in fact done in a render loop where a function updates the position of all vertices of the PlaneBufferGeometry.

Two of the properties are not recognized even though they exist on the underlying JS Object, here are the errors:
Error:(30, 48) TS2339: Property ‘dynamic’ does not exist on type ‘BufferAttribute | InterleavedBufferAttribute’.
Property ‘dynamic’ does not exist on type ‘InterleavedBufferAttribute’.

Error:(56, 48) TS2339: Property ‘needsUpdate’ does not exist on type ‘BufferAttribute | InterleavedBufferAttribute’.
Property ‘needsUpdate’ does not exist on type ‘InterleavedBufferAttribute’.

Thanks for the reply

4

Did you try using
geometry.getAttribute("position").needsUpdate instead of
geometry.attributes.position.needsUpdate?
The docs recommend against accessing the .attributes property directly

5

Using TS to code, I am following an example at:
threejs.org/examples/?q=dynam#webgl_geometry_dynamic

I tried your suggestion like that but same result:

let position:THREE.BufferAttribute|THREE.InterleavedBufferAttribute = this.geometry.getAttribute("position");
console.log(position);
position.dynamic = true; //Error still

dynamic field does exist as shown below:
dynamic-exist

6

.dynamic does not exist in an InterleavedBufferAttribute, only in a BufferAttribute. So if you’re saying it could be both, the compiler errs in the side of caution and decides to not allow it.

If you do a bit of type-assertion, you can tell the compiler that you know it’s going to be a BufferAttribute for certain:

let pos = (<THREE.BufferAttribute>this.geometry.getAttribute("position"));
pos.dynamic = true;
4 Likes
7

You are correct that was it!
That compiler error finally went away, it was starting to get under my skin.
I should have checked both classes, good to know for next time.
The line below works great now.

(<THREE.BufferAttribute>this.geometry.getAttribute("position")).needsUpdate = true;

Many thanks!!!

1 Like