Retrieve Object3D in three.js based on a custom property value

Question

Retrieve Object3D in three.js based on a custom property value

In my coding project, I have been creating instances of LineSegments in the following manner:

const geometry = new THREE.BufferGeometry();
geometry.setAttribute('position', new THREE.BufferAttribute(vertices, 3));

const edges = new THREE.EdgesGeometry(geometry);
const line = new THREE.LineSegments(edges2, new THREE.LineBasicMaterial({ color: 0xffffff }));
scene.add(line);

After that, I went ahead and added some custom properties to the lines like this:

line.prop1 = "hello";
line.prop2 = "world";

Now I'm wondering how I can retrieve all objects with a specific property value, for example, finding all objects where prop1 is set to "hello"?

javascript three.js

Answer 1

Answer №1

Unfortunately, there is no built-in method available for this specific scenario. The Object3D.getObjectByProperty() function is limited to objects with a unique property value. To solve this issue, you can use the following custom function:

function findObjectsWithProperty(object, property, value, result = []) {

    // Check if the current object has the specified property and value
    if (object[property] === value) {
        result.push(object);
    }

    // Check children recursively
    for (let i = 0, l = object.children.length; i < l; i++) {
        const child = object.children[i];
        findObjectsWithProperty(child, property, value, result);
    }

    return result;
}

//

const objectsMatchingProperty = findObjectsWithProperty(scene, 'property1', 'test');

Answer 2

Unfortunately, there is no built-in method available for this specific scenario. The Object3D.getObjectByProperty() function is limited to objects with a unique property value. To solve this issue, you can use the following custom function:

function findObjectsWithProperty(object, property, value, result = []) {

    // Check if the current object has the specified property and value
    if (object[property] === value) {
        result.push(object);
    }

    // Check children recursively
    for (let i = 0, l = object.children.length; i < l; i++) {
        const child = object.children[i];
        findObjectsWithProperty(child, property, value, result);
    }

    return result;
}

//

const objectsMatchingProperty = findObjectsWithProperty(scene, 'property1', 'test');

Retrieve Object3D in three.js based on a custom property value

Answer №1

Similar questions

Transitioning from the older version of meteor 1.8.3 to the latest version 2.6

Arrange divs on the screen in a specific formation

When the caret triangle is upside down, it indicates that a drop-down menu is available even when the

What could be causing the malfunction of useEffect() in my script?

Executing a personalized function - settings.func does not exist as a valid function

My data is not appearing with ng-repeat or ng-bind

Data can be retrieved in a React/Next.js application when a button is clicked, even if the button is located in a separate

Experiencing a 400 error while transitioning from ajax to $http?

What is the best way to dynamically insert an object into a field name in react-final-form?

Choosing the perfect item with the help of a material's GridList

Loading Embedded Content with ReactJS

Stop materializecss dropdown from closing when clicking within it

Exporting Blender's Particle System Hair to Three.JS

Prevent the use of harmful language by implementing jQuery or JavaScript

We apologize, but the module you are looking for cannot be found: Unable to locate 'fs'

Refreshing a jsp page without the need to reload the content

Prevent draggable functionality of jQuery UI on elements with a specific class

Can someone explain the meaning of the paragraph in the "Index Routes" section of the React-Router documentation?

AngularJS Resource GET Request Unsuccessful

Images are failing to load in Ionic 3