A step-by-step guide on combining multiple STL files into a single geometry

Is there a simpler way to handle this code for exporting to an STL file or for the cutting function? I find the current method too troublesome. Thank you!

var material1 = new THREE.MeshPhongMaterial( {
    color:0xffffff,
} );
loader.load( 'fanban1.stl', function ( geometry ) {
    stl_mesh1 = new THREE.Mesh(geometry, material1);
    stl_mesh1.position.set(20, 0, 40);
    stl_mesh1.rotation.set(-Math.PI / 2, 0, 0);
    stl_mesh1.scale.set(0.2, 0.2, 0.2);
    group.add(stl_mesh1);
    arr_mesh.push(stl_mesh1);
});


var material2 = new THREE.MeshPhongMaterial( {
    color:0xFFFF00,
} );
loader.load( 'fanban2.stl', function ( geometry ) {
    stl_mesh2 = new THREE.Mesh(geometry, material2);
    stl_mesh2.position.set(20, 0, -20);
    stl_mesh2.rotation.set(-Math.PI / 2, 0, 0);
    stl_mesh2.scale.set(0.3, 0.3, 0.3);
    group.add(stl_mesh2);
    arr_mesh.push(stl_mesh2);
});
scene.add(group);

After some edits, it looks like this:

    var allGeometry = new THREE.Geometry();
    loader.load( 'fanban.stl', function ( geometry ) {
        stl_mesh = new THREE.Mesh(geometry, material);
        stl_mesh.position.set(20, 0, -60);
        stl_mesh.rotation.set(-Math.PI / 2, 0, 0);
        stl_mesh.scale.set(0.3, 0.3, 0.3);
        group.add(stl_mesh);
        arr_mesh.push(stl_mesh);
        allGeometry.merge(geometry);
    });

However, an error is reported: THREE.Geometry.merge(): geometry not an instance of THREE.Geometry.

Answer №1

Are you referring to a code review situation? If that's the case, it might be more appropriate to post your question on Stack Exchange Code Review. In terms of functionality, both options perform similarly when the mesh is loaded. Here's a suggested starting point:

function createMesh(geom, material, x, y, z, scaleX, scaleY, scaleZ) {
  var mesh = new THREE.Mesh(geom, material);
  mesh.position.set(x, y, z);
  mesh.rotation.set(-Math.PI / 2, 0, 0);
  mesh.scale.set(scaleX, scaleY, scaleZ);
  group.add(mesh);
  meshArray.push(mesh);
}

Implementation example:

var materials = [
  new THREE.MeshPhongMaterial({color:0xffffff}),
  new THREE.MeshPhongMaterial({color:0xffff00})
];

loader.load( 'fanban1.stl', function ( geometry ) {
  createMesh(geom, materials[0], 20, 0, 40, 0.2, 0.2, 0.2);      
});
loader.load( 'fanban2.stl', function ( geometry ) {
  createMesh(geom, materials[1], 20, 0, -20, 0.3, 0.3, 0.3); 
});
scene.add(group);

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

Generating fresh instances in for loop - JS

I am working on a page that showcases graphs based on selected criteria. Each graph requires its own object reference, and I am creating new objects within a for loop. However, I'm facing the challenge of accessing those objects outside of that specif ...

Tips for showcasing overflowing text in a menu list by rotating the item text

Imagine you have a TextMenuItem component, using MenuItem from the Material-UI library, that is part of a chain consisting of DropDownSearch > SimpleListMenu > FixedSizeList > TextMenuItem. In simple terms, this creates a searchable dropdown eleme ...

The NEXT_LOCALE cookie seems to be getting overlooked. Is there a mistake on my end?

I am looking to manually set the user's locale and access it in getStaticProps for a multilingual static site. I have 2 queries: Can a multilingual website be created without including language in the subpath or domain? Why is Next misinterpreting m ...

Developing a server-side checkbox feature and implementing a corresponding JavaScript function

After dynamically creating a checkbox on the server-side and populating it in a table on the webpage, I want to utilize it to trigger some JavaScript functions on the client side. However, I'm unsure of how to activate the function using a checkbox c ...

Ways to fetch additional Product Cards using JSON and a nextPage parameter

I'm facing difficulties in nesting a fetch inside another fetch. I'm not sure if this is the correct approach, but my goal is to utilize Vanilla JavaScript to fetch another JSON from the nextPage URL within the JSON list when the "load more" butt ...

Troubleshooting issue with DOM not refreshing after making a $http POST request in a MEAN

I am working on an app that interacts with a Mongo database through CRUD operations. Currently, I have a form input where users can add elements, and I want these elements to appear below the form in real-time as they are added. However, at the moment, the ...

A loop that incorporates a jQuery JavaScript dropdown menu along with some calculations

My goal is to have multiple dropdown lists populated from a PHP while loop. Each select dropdown has a corresponding textbox that should update its value when a selection is made. However, the current script only works for a single dropdown outside of the ...

What is the best way to implement JQuery in order to trigger an event in a text box whenever the user hits the "enter

Also, refrain from submitting the form if the user hits enter in THAT PARTICULAR input field. ...

It is impossible to alter the data contained within the input box

Objective: Upon clicking a button to display the modal, the selected data (first and last name) should be inserted into an input box and editable. The user should be able to modify the data. Issue: The data entered into the input box cannot be edited ...

Selection Change Event for Dropdown Menu

Just starting to learn JavaScript and currently working with 3 select elements on a JSP page: <select id="railwayServiceList" name="railwayService_id" onchange="changeCompaniesCombo()"></select> <select id="companyList" name="company_i ...

Unique background image is assigned to each div sharing the same class

Seeking a way to assign unique random backgrounds to each div with the .item class. Initially attempted using PHP and CSS, for example: <?php $bg = array('bg1.jpg', 'bg2.jpg', 'bg3.jpg', 'bg4.jpg', 'bg5.jpg ...

Transfer the Vue query parameter from the current route to the router-link

Why is it so challenging to detect and pass query parameters in Vue components? I'm trying to access the router from my component, but nothing seems to be working. How can I achieve this? <router-link :to="{ path: '/', query: { myQue ...

What are the steps to executing commands with child processes in Node.js?

I have successfully established communication between the client and server using socket.io. I am now utilizing WebSockets to send commands from the client to the server, and I would like to execute these received commands on the server. Here is my approa ...

Is it better to manually input a list of select options in the user interface or retrieve them dynamically from the database in case of future changes?

Imagine designing a user interface that allows users to choose their favorite Pokemon from options like Bulbasaur, Squirtle, and Charmander. Within the database, there is a lookup table containing all possible choices: pokemon --- id name 1 Bulbasaur 2 ...

Conceal the sidebar menu by clicking anywhere outside of the menu bar or the designated button

I attempted to create a menu similar to the semantic UI, but so far I have only been able to click the menu button to open and close the menu. I am using a toggle class to display the sidebar, but I'm unsure if this approach is entirely correct: < ...

Experiencing difficulties with knockout bindings

I have a situation where I have multiple tabs labeled A, B, and C, and upon loading the 'C' tab, the model properties should data-bind to tab 'C'. I am encountering an issue with data binding. These three tabs (A, B, C) are located ins ...

Having issues with reading files in PHP using AJAX? Explore alternative methods for downloading files seamlessly

I need to store a value in a txt file and allow the user to download it. Currently, the value is successfully written to the txt file, but the readfile function does not execute, preventing the download from starting. The PHP code is on the same page as ...

What is the method employed by Node.js to manage relative paths?

I am facing an issue with how Node.js handles paths. Despite checking the documentation, I couldn't find the solution to my problem. Basically, I have a file that contains a relative path pointing to another file (specifically a PNG image). Dependin ...

Ways to customize decoration in Material UI TextField

Struggling to adjust the default 14px padding-left applied by startAdornment in order to make the adornment occupy half of the TextField. Having trouble styling the startAdornment overall. Attempts to style the div itself have been partially successful, b ...

Adjusting the React Material UI TextField behavior upon a change in value while maintaining the

I have an MUI TextField component that I would like to trigger a function when it changes, while still allowing it to function as usual (without being a controlled input). <TextField onChange={(e)=>{ doSomething(e.target.value) //perhaps call ...