Moving the parent of a ThreeJS object to align with the geometry of its child

I am working with a 3D object that includes a cube mesh as a child. I am trying to adjust the position of the 3D object within the mesh in order to manipulate the pivot points of the cube mesh. You can find the code snippet on this codepen link.

            mesh = new THREE.Object3D();
            mesh.name = "mesh1";
            mesh.position.set(0.2, 0, 0);
            scene.add(mesh);
            var mesh1 = new THREE.Mesh(geometry1, material1);
            scene.add(mesh1);
            mesh1.name = "mesh2";

            mesh1.position.set(0.4, 0, 0);
            mesh.add(mesh1);

Any help would be greatly appreciated.

Answer №1

To ensure proper organization, remove the line scene.add(mesh1) as you intend to attach your cube to the parent object rather than directly to the scene. To adjust the position of your object3D, simply modify the position attribute or translate the cube's geometry.

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

IE11 not processing jQuery ajax response correctly

While creating a login page using jQuery/AJAX, my code is functioning perfectly on all browsers except for IE11. In IE11, I am encountering the following exception: SCRIPT7002: XMLHttpRequest: Network Error 0x800c0008, The download of the specified resour ...

Guide on making a POST request through axios for REST API:

How can I send a POST request using axios to a REST API? Headers I'm experiencing issues with incorrect headers when making GET requests, and I'm not sure why. Additionally, I've found that the documentation for axios doesn't always w ...

What is the best way to bring in Javascript files to a specific component along with HTML and CSS?

` <script src="./jquery.min.js"></script> <script src="./bootstrap.bundle.min.js"></script> <!-- Core plugin JavaScript--> <script src="./jquery.easing.min.js"></script> <!-- Page level plugin JavaScr ...

Preview functionality is disabled in the iOS share extension

Currently, I'm developing a share extension for Safari on iOS. Our approach involves utilizing the default UI provided by iOS and extending the SLComposeServiceViewController class. In addition to this, I have incorporated a JavaScript function to ext ...

The content inside the bootstrap modal is not visible

My goal is to trigger a modal window when a specific div is clicked using bootstrap modal. However, upon clicking the div, the screen darkens but the modal body fails to appear. Code: <html> <head> <title></title> ...

Does it follow standard practice for Array.filter to have the capability to also perform mapping on an array of objects?

While experimenting with Array.filter, I made an interesting discovery. By forgetting to include an equality check, my array was unexpectedly mapped instead of filtered. Here is the code snippet that led to this result: const x = [{ name: 'user' ...

Encountering difficulties loading Google Maps with jQuery

When attempting to load a map on my page, I encountered a problem when including the jquery.min.js file in the head tag. If it is included, I receive an initMap : no such method error. However, if I reverse the order of inclusion, with maps first and then ...

What is the best way to extract row data from a datatable and transmit it in JSON format?

I have successfully created a code that retrieves data from a dynamic table using ajax. However, I am facing an issue where I only want to send data from checked rows. Despite trying different approaches, I keep encountering errors or receive an empty arra ...

What steps can be taken to avoid caching PHP variables?

My code in functions.php on WordPress generates an affiliate link based on the visitor's location. It works perfectly, but there's a problem with page caching (W3 Total Cache). The variables get cached, so if a visitor from the UK opens the page ...

Contrast between utilizing filter_input and accessing $_POST directly following an asynchronous AJAX request

When I use filter_input(INPUT_POST, 'attribute') and $_POST['attribute'], I get different results and I can't figure out why. The Post-Request is sent by a JavaScript script built with JQuery and it looks like this: // type javaS ...

Data Binding in AngularJS appears to be non-functional

Experimenting with AngularJS, I created a small code snippet that doesn't seem to bind data properly. Here is the HTML and JS code for those who prefer not to visit the provided link: first.html <!doctype html> <html ng-app="firstApp"> & ...

The button on my VUE 3 quiz app is not changing to 'Finish' when I reach the final question

Struggling with my Vue 3 quiz app - everything works perfectly until I reach the last question. The button text should change to 'Finish' once the final question is loaded. Despite hours of searching and even using copilot, I still can't fin ...

Ways to display a GIF image as a pop-up during data loading in an MVC application

I am working on a project using the MVC framework. The application retrieves a large amount of data during loading. I would like to display a loading image - a .gif file while fetching records. Below is the code snippet I am currently using: //Loads rec ...

Visualize data retrieved from a third-party website through scraping in a chart

After attempting to extract data from a website's data.asp file (formatted in json) and display it as a chart on my site using Google Chart API or FusionCharts, I'm facing issues. Although I can retrieve the json data, it doesn't render as a ...

Is there a way to create an image gallery layout similar to Pinterest using CSS?

I am currently developing a dynamic PHP gallery that will feature thumbnails with the same width but varying heights. These thumbnails will be arranged from left to right, so I would prefer not to use a traditional five-column layout. I suspect that achiev ...

Capturing a res.send(404) error in ExpressJS during production: Tips and tricks

Can middleware handle errors like 404 and 500 when they are returned this way? exports.index = function(req, res) { res.send(404); } In production, I would want to display a custom missing page for these errors. However, my error handler middleware doe ...

Stop a hacker from obtaining the usernames from a system

Our forgot password page has been identified with a security issue that needs attention: ISS-0003938 Web Inspect Open Medium Suspicious Files Found in Recursive Directory ****** Remove any unnecessary pages from the web server If any files are nec ...

Using ajax for transferring form data to a different php page

Hello everyone, I'm in need of assistance. I have a form on one PHP page and I want to use AJAX to pass the data to another PHP page that will update my database and then return the results. <form name="profile" class="profile"> < ...

ReactJS did not get the expected function type for the onClick event listener, instead receiving an object type

I am encountering an issue where I expected the onClick event listener to be a function but instead got an object type error. Can someone offer guidance on how to resolve this problem? Below is a snippet of my code: render_detail_options = () => { ...

Discovering the destination link of a website while utilizing GM_xmlhttpRequest

Picture yourself browsing a webpage called "www.yourWebsite.com" and utilizing userscripts in Tampermonkey to extract data from another site using the GM_xmlhttpRequest function. As you make requests with the GM_xmlhttpRequest function to visit "exampleWe ...