What could be the issue with this exported object from Blender in Three.js?

I am encountering issues while exporting individual pieces from a larger model in Blender. Some objects are throwing errors and failing to load. Here is the specific error message:

Uncaught TypeError: Cannot read property 'attributes' of undefined
Uncaught TypeError: Cannot read property 'transparent' of undefined

One of the JSON files from Blender that is causing trouble can be found here:

The JSON file passes linting tests, and other objects from the same model load without any issue. It's puzzling why this particular one isn't working.

Below is the code snippet I am using to load the JSON:

  App.JsonLoader.load(mesh, function (geometry, materials) {
    var componentMesh = new THREE.Mesh(geometry, new THREE.MeshFaceMaterial(materials));
    componentMesh.scale.set(50, 50, 50);
    componentMesh.position.y = 50;
    componentMesh.position.x = 0;

    App.vehicle.object3d.add(componentMesh);
  });

Answer №1

UPDATE: This response is no longer applicable


The structure of your model does not have a materials attribute, which is required for the MeshFaceMaterial function. The error message indicates that Three.js is searching for transparent within materials, but it is not defined.

You have two options:

  1. Avoid using

    new THREE.MeshFaceMaterial(materials)
    and create your own material instead.

  2. Add the materials attribute to your model.

For reference, you can view an example model containing materials here.

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

When the screen is at mobile width, elements with the class "Responsive" are hidden using the display:none; property. These elements can be

Hey there! So, I've got this cool interactive banner on my website. It features 2 slider sections with some awesome products on the right side. The layout is responsive, meaning that when you switch to a mobile screen size (around 515px or less), the ...

When is it necessary to escape special characters? (Using jQuery Selectors)

As per the documentation provided by jQuery, it is essential to escape metacharacters that appear in selector strings when used as a literal. However, I found limited specific examples on when to escape selectors. So, the question arises: When should I esc ...

MongoDB Casting Error: Unable to convert "xxx" to ObjectId for field "_id"

My current challenge involves fetching files with a specific criteria: ShipmentRequest.find() .where('estatus').in(['Asignada','Inicio Carga','Fin Carga','En Transito','Entregada']) . ...

What is the best way to locate an item reference for a specific DOM element?

Imagine a vast DOM structure with approximately 10,000 HTML elements, including 1,000 span tags. None of the span elements have any identifiers and are buried deep within other objects with long, complex Xpath paths that are not user-friendly for selectio ...

Open boxes with walls that don't create shadows

Currently, I am facing an issue with an open-sided box created using MeshStandardMaterial and BoxGeometry. I have configured the box to cast and receive shadows, but it is not behaving as expected. I anticipated the interior of the box to darken when the p ...

Creating a hierarchy of dictionaries by nesting a list of dictionary elements

ISSUE DESCRIPTION The task at hand involves transforming an input list of dictionaries (x) into another list of dictionaries (y), where the key is pickupAddress and the sub-dictionary includes {zipcode, lat, long}. Therefore, the objective is to convert ...

Is there a way for me to retrieve a $scope array that is declared within a .then() function in AngularJS?

Below is the code snippet for my controller: $http.get(config.url+'/api/employees-suggestion/??token=' + currentUser.token + '&filterEmployee='+ "10000191") .then(function(response) { console.log(response); $scope.id_li ...

Is there a possibility for the code following the await call to be executed in a random order if an async Vuex action is triggered twice?

const actions = { search: debounce( async ({ commit, dispatch, getters, rootGetters }, { page = 1 }) => { commit("setLoading", true); commit("setPage", page); console.log("Starting...") const ...

Rails 7 is missing the Toast element from Bootstrap 5

Having some trouble with implementing Bootstrap 5 Toast in Rails 7 for flash messages. Here is the code I am currently using: # application.html.erb <head> ... <%= javascript_importmap_tags %> <script> const toastElList = document.que ...

Changing time format from ISO time to short time in JavaScript

I am working on an ajax call that retrieves a time in the format 16:06:59, and I need to convert it to 4:06 PM. var mydate = obj[0].time; The variable mydate contains 16:06:59, but when I try to use it with var date = new Date(), it returns today's ...

Using Echarts markLine feature with series that are stacked together

As I attempt to place two line series at the top of a graph using the markLine option, I encounter an issue. The line series are stacked, but when I apply a markLine with the type: max option, the markLine on the top graph appears below the graph because t ...

Is there a way to avoid using the super() constructor unnecessarily in Eslint?

code: constructor(cdr: ChangeDetectorRef, inj: Injector) { super(cdr, inj); } eslint: { ... overrides: { ... rules: { ... "@typescript-eslint/no-useless-constructor": "error", ... ...

Issue with accessing account using ajax

Attempting to set up a login page using Ajax for the first time, but encountering some issues. The login HTML allows users to input their username and password, with a submit button that triggers a JavaScript script when clicked. However, upon entering t ...

Understanding the intricacies of Angular's $scope and $watch function can

At the start of my Angular 1.0 journey, I'm gradually getting the hang of it, but some aspects still have me puzzled. Recently, while working with $watch, I encountered a perplexing issue. Here's the snippet in question: $scope.$watch('co ...

The array bound to the model is not in sync with the AngularJS select directive

My task involves creating a basic select directive using angularjs. However, I am facing an issue where the options in the select directive appear out of order. The directive is meant to provide numeric options up to 100. I initialize an array using a l ...

Changing the text of a button using ngClass in Angular's toggle functionality

Is there a way to modify the text of a toggled button class in Angular using Bootstrap? Currently, I have this code to toggle the class: html <!-- toggle button --> <button type="button" class="btn btn-primary mt-3 ml-3" (click)="status=!status ...

The response from NodeJS is not being properly parsed by Express or BodyParser

const express = require('express'); const bodyParser = require('body-parser'); const app = express(); const adminRoutes = require('./routes/admin'); const shopRoutes = require('./routes/shop'); // app.use(express.u ...

A method for calculating the product of two selected numbers and then adding them together

I am currently working on a form that includes two select options; one for logo design and another for letterhead design. Users should be able to choose the quantity of each design, or both if they wish. For example, a user could select 2 logo designs and ...

Managing a Python (JSON) key error even when the key has been confirmed to exist

I am having issues with running the code below. Even though I know that the key "vin" exists, I keep encountering a key error. How can I address this problem within the code? #page_url = 'https://www.cargurus.com/Cars/inventorylisting/viewDetailsFilte ...

Representation of JSON Structure

I've never used JSON in my application before, but I have an object that looks like this : @interface Selection : NSManagedObject @property (nonatomic, retain) NSString * book_id; @property (nonatomic, retain) NSString * contenu; @property (nonatomi ...