Incorporate a new substance into a THREEJS Mesh

Is there a way to add a material to an existing mesh without calling the mesh constructor again?

I already have a mesh created using the constructor:

    var mesh = new THREE.Mesh(geometry, material);

Now I have created another material in my code:

    var material2 = new THREE.MeshBasicMaterial();

How can I add this new material to the existing mesh?

    mesh.material = [material, material2]; //does not work

The above method does not seem to work. Is there a different way to achieve this?

javascriptthree.jsmesh

Answer №1

After some investigation, I've discovered the solution actually works when you pass the entire array to the mesh. Avoid attempting something like this:

    mesh.material = someArray.map(function(item){return 
    item.material;});

This was my mistake. Additionally, if you don't clone materials and store them in variables first before using them, unexpected behavior may occur.

It's possible that this issue could be related to a browser compatibility problem - strange occurrences can happen unexpectedly at times.

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

Guide on submitting a get form and retrieving the information

Currently, I am employed as a penetration tester for a company. While conducting an analysis of their website, I discovered a vulnerability where CSRF tokens are generated via a GET request to the page localhost/csrf-token and then provided in plaintext fo ...

javascriptphpjqueryhtmlcurl

Using jQuery, retrieve the "select" element within a specific row of a

I am working on a table row that has the following HTML structure: When the user interacts with the "Name" field, I trigger the "select" event and pass it to the nameDropChanged function. Once I have a reference to this select element, I need to change th ...

javascriptjqueryhtmljquery-selectors

Customize your Wordpress site with a JQuery load more button specifically designed for custom post types

I'm currently working on adding a "load more" button to my WordPress website in order to load my custom post types. I've managed to successfully make it load the posts, but I'm facing an issue where each time I load more posts, it replaces t ...

javascriptphpjqueryajaxwordpress

Issue encountered when displaying an organized list in next.js

I have been working on rendering an array of items in descending order based on their values. Everything seems to be functioning correctly, but I keep encountering an error that reads Error: Text content does not match server-rendered HTML. whenever I tr ...

javascriptreactjsnext.js

Filtering Array Values within an Object using JavaScript

I need help filtering an object based on array values. For example: { "sun":["sleep","walk"], "mon":["read","dance","ride"], "tue":["work",&q ...

javascriptobjectlodash

Retrieve the id for the chosen user name within a function that contains an array of objects

const userList = [ {name:"jonh" ,id:EAD1234}, {name:"peter" ,id:EAD1235}, {name:"matt" ,id:EAD1236}, {name:"henry" ,id:EAD1237}, ] In the array above, there are various users with their respective IDs. The goal is t ...

javascriptreactjsarraysecmascript-6

Utilize the Vue-Chartjs plugin registration for a specific chart component only

I am currently working with a chart component in Vue 3 using the composition API. My goal is to incorporate the datalabels plugin into this specific chart only. Upon attempting to register the plugin outside of the chart's data or options, I noticed ...

javascriptvue.jschart.js

Issue: ENOENT - The specified file or directory, './views/s.ejs', does not exist in Node.js Express

Encountering an error when attempting to render a file from the 'views' directory in the 'routes'. The specific error message is as follows: Error: Valid Login { [Error: ENOENT: no such file or directory, open './views/s ...

javascripthtmlmysqlnode.jsexpress

Configuration of an MVC-based web application

As a newcomer to web application development, I am currently working on building a web application using the Model-View-Controller pattern. My setup includes a MySQL database for the Model, JSP pages for the Views, and a DAO for the Controller. I am looki ...

javascriptjspwebweb-applications

One file successfully imports a dependency, while the other file does not seem to recognize it

I'm diving into the world of Vuex, exploring how to create an auth module. I came across some examples that I'm trying to implement, but I've hit a roadblock when attempting to use axios in my store. My store is structured with separate file ...

javascriptvue.jsaxiosvuex

What is a common mistake when using refs in React?

I've recently started diving into React. I've seen conflicting opinions on using refs - some sources claim it's a bad practice altogether. Can someone clarify this for me? Is it harmful to attach refs to child components in order to access ...

javascriptreactjsrefs

Mastering the art of chaining promises in Mongoose

I need help figuring out how to properly chain promises for a "find or create" functionality using mongodb/mongoose. So far, I've attempted the following: userSchema.statics.findByFacebookIdOrCreate = function(facebookId, name, email) { var self = ...

javascriptnode.jsmongodbmongoosepromise

Selection list with limited comment choices

I am facing a challenge and would greatly appreciate any hints. I am working with a PHP loop to populate comments for a thread, like this: <tr><td>'.comment_date'.</td><td>'.comment_author.'</td><td> ...

javascriptjqueryhtmlajax

Npm is unable to locate the package.json file in the incorrect directory

Hello, I am currently in the process of setting up webpack. I have all the configurations ready, but when I attempt to execute webpack in my terminal, it looks for the package.json file in the incorrect location. Is there a way for me to modify the path ...

javascriptjsonnode.jsnpmpackage.json

By clicking anywhere, AngularJS will remove the specified class

Imagine having a search box that is displayed after the user clicks on a button. Great so far, right? But what if you want to add another feature - making the search box disappear when the user clicks anywhere else. How can this be achieved with AngularJS? ...

javascriptjqueryangularjs

What are the reasons for validation failure when it is moved into a method?

I am currently in the process of developing a validation function in JavaScript. However, when I extracted the logic into a private method, my validation started failing and I can't seem to figure out why. Here is my HTML definition: <input type= ...

javascriptjquery

Tips for updating the checkbox state while iterating through the state data

In my component, I have the ability to select multiple checkboxes. When a checkbox is selected, a corresponding chip is generated to visually represent the selection. Each chip has a remove handler that should unselect the checkbox it represents. However, ...

javascriptreactjstypescriptreact-hooksreact-state

Ways to have a React Component trigger a function with each state update

Using this specific component, the getDisplay function is triggered on every update like normal. When the <div> element is clicked, it becomes hidden: class Example extends React.Component { constructor(props) { super(props); thi ...

javascriptreactjsnpmstate

What is the best way to include the file name and size as query parameters in Node.js?

To retrieve an image from the folder, a query needs to be passed containing the filename and dimensions like this: localhost:3000/images?filename=myImage&width=100&height=100 The initial objective is to fetch images from the designated folder, res ...

javascriptnode.jstypescriptsharp

Ignoring page redirects in Node.JS

Directories are organized as follows: -public -landing -landing.html -Login -login.html -register -register.html -routes HTMLroutes APIroutes - server.js All commented code are attempts I have made without success if (bcry ...

javascriptnode.jsexpresshttp-redirectroutes