"Utilizing multiple materials in a single obj file using the power of three.js

As I work with three.js to load an obj file featuring a ring adorned with pearls, I face a challenge. The obj file lacks an mtl file, a result of the exporting software - possibly Rhinoceros - not including it (as per the graphic designer's explanation).

My goal is to apply a metallic material exclusively to the ring, while adorning the stones/pearls with a glass material.

To preview the file in action, visit this test page: jaaxlab.com/test_youring

However, I'm unsure how to assign a single material to the ring and multiple materials to the stones.

For access to the obj file, click here: jaaxlab.com/test_youring/obj/prova1.obj

javascriptthree.jsobjloader

Answer №1

Your item has multiple offspring. The offspring at position 0 is the ring, identified as 

sezione_B_misura13_Riviera_mix_full anello_sezione_B_misura13
.

You can access it like this:

obj.children[0].material = new THREE.MeshStandardMaterial(...);

or

obj.getObjectByName('sezione_B_misura13_Riviera_mix_full anello_sezione_B_misura13').material = new THREE.MeshStandardMaterial(...);

Remember that obj refers to the object you loaded with the loader.

Check out this jsfiddle for more information. Load your file, then view the console log. You can also click on any part of the object to see its id and name in the console.

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

Why isn't httpUploadProgress functioning correctly with Buffer data?

Recently, I have ventured into the world of node.js/express as I am attempting to create a multiple image uploading application utilizing cloudfront and an s3 bucket. My goal is to display a progress bar for the user by integrating socket.io for real-time ...

javascriptnode.jsexpressamazon-s3foreach

When the second click triggers the loading of a JSON lot via AJAX

As a newcomer to jQuery and ajax, I am in the process of developing an application where content is loaded from a JSON file based on the navigation option selected. Here is the code snippet I've been working on: $(document).ready(functi ...

javascriptjqueryjsonajax

Ways to showcase logs on the user interface

After configuring a set of operations in the UI and initiating the operation, a Python script is called in the backend. It is necessary to display the logs generated by the Python script on the UI. I managed to implement this in a similar way as described ...

javascriptangularjsnode.jshttp

Customize the size of data points on your Angular 2 chart with variable

In my Angular 2 application, I am utilizing ng2-charts to create a line chart. The chart functions properly, showing a change in color when hovering over a point with the mouse. However, I want to replicate this behavior manually through code. Upon clicki ...

javascriptangularjsangularchart.jsng2-charts

Tips for adjusting the language settings on a date picker

Is there a way to change the language from English to French when selecting a month? I believe I need to configure something in the core.module.ts. How can I achieve this? https://i.sstatic.net/Cpl08.png @NgModule({ declarations: [], imports: [ Co ...

javascriptangulartypescriptdatepickerngx-bootstrap

Ways to execute a function when a button is clicked with a shared variable?

When creating buttons in HTML to control video speed, I encountered a strange issue. After successfully implementing the buttons for one video, they only worked on a second video and had no impact on the first one. Deleting the second video seemed to resol ...

javascripthtmljquery

Having difficulty implementing a hover event on a sibling element of a target using either the duration parameter in jQuery UI or CSS

My objective is to alter the background color of an element and one of its higher siblings in the DOM but within the same parent upon hover. While I successfully used CSS transition to change the first element, I encountered difficulty getting the sibling ...

javascriptjqueryhtmlcss

AJAX Post Request Function without Form That Does Not Reset

I am currently struggling with understanding the Ajax POST method. I am attempting to make an API request, and since the response has similar parameters, I decided to create a global function that can be used by other HTML/JS pages. However, I am aware tha ...

javascripthtmljqueryajax

The URL for Ajax is not defined

I am currently working on a function that involves fetching an XML file and making some edits to it. This is new territory for me, so I had to do some research on the best approach to accomplish this task. After some consideration, I decided to use AJAX. H ...

javascriptjqueryajax

Getting Bootstrap columns to work well with Angular ng-show

I am working with three columns in Bootstrap, all set to col-md-4 width. The middle column has an ng-show attribute that may hide it at times. When the rightmost column becomes visible due to friend requests, it displaces the middle column if it's hid ...

javascriptcssangularjstwitter-bootstrap

How can PHP effectively interpret JSON strings when sent to it?

When working with JavaScript, I am using JSON.stringify which generates the following string: {"grid":[{"section":[{"id":"wid-id-1-1"},{"id":"wid-id-1-4"}]},{"section":[{"id":"wid-id-1-5"}]},{"section":[{"id":"wid-id-1-2"},{"id":"wid-id-1-3"}]}]} I am ma ...

javascriptphpajaxjson

Tips for creating a transparent ShaderMaterial in Three.js

As a complete beginner to shaders, I am on a quest to create a unique color and transparency effect. If you want to see what I'm aiming for, take a gander at: This Example or That Example Now let's compare it to my current outcome: What I' ...

three.jsshaderfragment-shader

Converting MongoDB Queries to MySQL in Node: A Step-by-Step Guide

I am currently facing a challenge where I need to migrate my app's database from mongoDB to mysql. The application was initially developed using node.js, but I encountered an issue with the "Create table" query while attempting the conversion process. ...

javascriptmysqlmongodb

How can I adjust the transparency in a JavaScript popup modal window for an ASP.Net GridView?

Recently, I added an 'onclick' event to every row of an asp gridview and the popup window that appears is functioning perfectly. Now, I'm interested in adding a transparency level to the body of the popup window for a translucent effect. Can ...

javascriptc#cssasp.netgridview

Breaking down setInterval IDs for their corresponding function parameters

I plan on running multiple setIntervals, and though there may be a more efficient way to do it, that's something I'll consider later down the line. Is there a method for achieving this? var a = setInterval(function(a){ console.log(a); c ...

javascriptnode.jsecmascript-6setinterval

Linking a background image in the body to a specific state in next.js

My aim is to create a pomodoro timer using Next.js and I'm trying to link the body's background image to a state. However, my code isn't functioning properly. This is the code I used to update the body style: import { VscDebugRestart } from ...

javascriptcssreactjsnext.js

Which specific HTML element triggers the initiation of ajax in Jquery?

I have a situation where various HTML elements trigger ajax requests when clicked. My goal is to determine which specific element was clicked inside the ajaxComplete event. Although I attempted to use event.target, it only returns the entire document inst ...

javascriptjqueryhtmlajax

The word-break CSS property is ineffective in this situation

I've been experimenting with the word-break css property, but I just can't seem to get it to work even when using a simple example. Here's my code: React: render() { return ( <h5 className="word-break">A very very long line.... ...

javascripthtmlcssreactjs

Modify the value of a variable inside another {{variable}} (not sure what it's called)

I am looking to update the variable "prefs" to reflect either "easy, medium, or hard" options based on user interaction. For instance: THIS {{choice.prefs.title}} NEEDS TO BE UPDATED TO {{choice.easy.price}} or {{choice.medium.price}} or {{choice.hard. ...

javascriptjqueryangularjsionic-framework

Encountering a ReferenceError while debugging MongoDB: The console object is undefined

Using a js file within mongodb, I implemented a code snippet containing a console.log expression for debugging purposes: use test; db.city.find().snapshot().forEach(function(city){ var Pos = city.Pos; if (Pos) { longLat = Pos.split(" ...

javascriptmongodbmongodb-shell