Harnessing WireframeHelper with Objects at the Ready

Recently in my Three JS project, I decided to incorporate JSON files obtained from clara.io for some cool objects. Upon successfully loading them using THREE.ObjectLoader, the objects rendered perfectly on the scene.

However, when attempting to present the wireframe of these objects utilizing THREE.WireframeHelper, an unexpected error arose:

Uncaught TypeError: Cannot read property 'array' of undefined

Evidently, it seems that the object's geometry is missing or undefined.

So this raises a question: Are custom shapes loaded through this method always devoid of geometries? If not, how can I acquire an object with its geometry preserved?

javascriptthree.js

Answer №1

The object that has been loaded may contain various child objects and meshes.

When implementing your loader callback, follow this suggested approach:

object.traverse( function( child ) {

    if ( child instanceof THREE.Mesh ) {

        var wireframe = new THREE.WireframeHelper( child, 0xffffff );
        scene.add( wireframe );

    }

} );

Version of three.js: r.73

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Identifying if a variable is redirecting

Dealing with React Router Dom V6 I am facing an issue with two loader functions that make server requests. async function fetchUserDetails(userId, userAction) { const token = getAuthToken(); const userData = await axios({ url: API.endpoint + &apos ...

javascriptreactjsreact-routerreact-router-dom

Improving Performance in Vue by Reducing `$set` Usage

Sharing my code snippet below <div v-for="namespace in chosenNamespaces" v-bind:key="namespace.id"> <!-- Select the Parameter --> <select @change="updateParameter($event, namespace.id)" v-model="currParameterValues[na ...

javascriptvue.jsvuejs2setv-for

Sorting an array of numbers using Javascript

Does anyone know how to properly sort an array in JavaScript? By default, the sort method doesn't work efficiently with numbers. For example: a = [1, 23, 100, 3] a.sort() The sorted values of 'a' end up being: [1, 100, 23, 3] If you hav ...

javascriptarrays

Using jQuery to modify the contents of a div in real-time is resulting in the loss of HTML encoding

I have come across a situation where I am dynamically changing the HTML content of a div called 'accordion' using the following code: // The variable htmlstring contains some HTML code with special characters like &, ', etc. // For example: ...

javascriptjqueryhtml

Upgrade personalized AngularJS filter from version 1.2.28 to 1.4.x

When working with a complex JSON response in AngularJS, I encountered the need to filter a deeply nested array within the data. The challenge arose when only displaying a subset of attributes on the screen, leading to the necessity of restricting the filte ...

javascriptangularjsfilter

Unexpected behavior when using JQuery's .load() method

In my HTML code, I have a main div element with child elements as lists. These lists are dynamically populated with data from the server and each item in the list has a checkbox. When a checkbox is checked, I want that item to move to the bottom of the lis ...

javascriptjqueryajax

Are you familiar with manipulating the JSON data array retrieved from an Ajax response?

Is it possible to handle a response from AJAX request in PHP? I'm not very familiar with JavaScript, so I'm struggling with this one. This is what I have managed to put together: var base_url = 'http://dev.local/westview/public'; $(& ...

javascriptphpajaxjson

JavaScript generates a series of checkboxes dynamically, all lined up in a single row

I am currently working on a script where I iterate over objects and aim to display the text of each object on a new line in the list format, along with a checkbox next to it. Despite successfully printing everything with a checkbox, the issue I am facing i ...

javascripthtml

Activate the click function of an asp.net linkbutton when the mouse enters by utilizing jQuery

I'm attempting to create a hover-triggered click event using jQuery. While this is a straightforward task, I've run into an issue where I can't seem to trigger the click event of an ASP.NET link button that refreshes the content of an updat ...

javascriptjqueryasp.nettriggerslinkbutton

A guide on navigating to a different component in Vuejs using a link

<div class="enterprise-details" style="margin-top: 20px"> Already signed up? <a href="#"> LOGIN</a></div> <!-- Component for redirection --> <b-button v-if="!registeredUser" class="button-self" v-b-modal.modal-x>Lo ...

javascriptvue.js

Load the template.html file using pure JavaScript without relying on jQuery

At the moment, I am implementing a template load process in the following way: $('#mydiv').load("template1.html") While I am currently relying on jQuery for this functionality, I am curious to know how I can achieve the same outcome using pure ...

javascriptjquery

How can I determine which component the input is coming from when I have several components of the same type?

After selecting two dates and clicking submit in the daterange picker, a callback function is triggered. I have two separate daterange pickers for SIM dates and Phone dates. How can I differentiate in the callback function when the user submits dates from ...

javascriptjqueryhtmlangularjs

What are the best methods to prevent infinity printing?

While attempting to create a clock that displays time in real-time after adding a time zone, I encountered an issue where the time was being printed multiple times. My objective is to have it printed once and dynamically change according to the different t ...

javascripthtmlapi

Uh-oh! Looks like there was an issue with the AJAX response: net::

CODE: FRONT-END $(document).ready(function(){ $('.delete-post').on('click', function(){ var id = $(this).data('id'); var section = $(this).data('section'); var url = &apo ...

javascriptjqueryajaxnode.jsfirebase

What is the syntax for creating a for loop in JSX within a React component?

I am working on a simple program that involves using a for loop to print numbers from 0 to 10. My goal is to utilize a for loop to print these numbers and pass the props to a child component. Please see my code below: import React, { Component } from &apo ...

javascriptreactjsecmascript-6

Customizing HTML list headers using an external JavaScript function

Hi everyone, I've been working on a login page and I want to enhance the user experience by displaying the logged-in user's username at the top of the screen, which can then trigger a dropdown list upon clicking. To achieve this, I've writt ...

javascriptjqueryhtml

The synergy between HTML and JavaScript: A beginner's guide to frontend coding

I have primarily focused on server-side development of enterprise applications (Java EE, Spring framework). However, I am now exploring client-side technologies for better understanding (not necessarily to become an expert). I have studied HTML and CSS th ...

javascripthtmlcss

Incorporating a new row in JQuery Datatable using an mdata array

I am currently using a datatable that retrieves its data through mData. var processURL="path" $.ajax( { type : "GET", url : processURL, cache : false, dataType : "json", success ...

javascriptjqueryhtmldatatable

Close button for body

I have created a form that floats in the center of the screen On this form, I have included a button designed to close it However, I would like for the form to be closed anywhere on the screen when clicked with the mouse Here is my code: $(".offer-clo ...

javascriptjquerycssfacebox

Tips for creating command line argument dependencies

In my NodeJS command line program, I've decided to separate the argument parsing and logic in index.js from the actual code in functions stored in different files. However, I'm facing an issue with writing argument dependencies and conflicts. Od ...

javascriptnode.jsecmascript-6