Retrieving the positions of a mesh as it looks towards an object in three.js

My scenario involves having a scene, multiple meshes, and a target object.

After setting up the scene, I use the code snippet below to make a mesh (referred to as mesh) face the target object:

mesh.lookAt(object)

This action successfully aligns the mesh with the object.

Now, I am trying to figure out how to replicate this rotation of the first mesh on another mesh so that it faces the same direction (not necessarily towards the same object but with the same orientation).

Is there a way to obtain the rotation coordinates of the initial mesh?

Furthermore, is there a method to calculate these coordinates without creating a new mesh or using the mesh.lookAt(object) function?

UPDATE: The best solution I found is to create a new THREE.Object3D() and utilize object.lookAt(target). Subsequently, you can repeat this rotation for all subsequently loaded objects using:

new_object.rotation.set(object.rotation.x, object.rotation.y, object.rotation.z)
. By implementing this approach, you only need to create one Object instead of generating numerous unnecessary Vector3-s.

Please avoid using

new_object.rotation = object.rotation
as it results in connected variables. Any changes made to the object's rotation will automatically update the new_object.rotation as well due to renderer updates occurring every frame.

Answer №1

To align the orientation of multiple meshes, you can simply assign the local rotation of one mesh to the others so that they all face in the same direction.

otherMesh.localRotation = referenceMesh.localRotation;

Answer №2

Have you considered using the lookAt function with a new THREE.Vector3 that includes the target's position coordinates?

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

"Unsuccessful Grails GSP Ajax Call: OnSuccess Function Fails to Trigger

Within my Grails .gsp file, I am executing an ajax call: $.ajax({ async: false, url: '<g:createLink controller="mycontroller" action="myaction"/>', data: params, dataType: 'json', contentType: 'application/json; ch ...

When I click the button, the page goes blank and keeps loading endlessly

http://jsfiddle.net/iansan5653/7EPjH/17/ <head> <script type='text/javascript' src='https://www.google.com/jsapi'></script> <script type="text/javascript"> function chart() { var pressure; ...

Tips for preventing duplicate Java Script code within if statements

In my function, there are various statements to check the visibility of fields: isFieldVisible(node: any, field: DocumentField): boolean { if (field.tag === 'ADDR_KOMU') { let field = this.dfs_look(node.children, 'ADDR_A ...

Updating the Structure of Various Objects with an Object Model Schema

Hello there, Query: Can you provide guidance on constructing a function that does the following: Accepts an object as the first argument; Takes a schema model as the second argument; The second argument is an array of objects with different models than t ...

Tips for preventing useEffect from triggering a route?

Recently delving into reactjs, I stumbled upon a situation in the code where the route alerts messages twice. I'm seeking advice on how to prevent this issue, please disregard the redux code involved. Any suggestions? Index.js import React from &apos ...

Combining rendering and redirecting in ExpressJS for efficient web page management

I'm currently using ExpressJS to develop the backend of my website, which involves calling an API to generate a response. One specific requirement I have is to indicate that a payment was successful and then automatically redirect to another page afte ...

Is there a way to locate an element within innerHTML using getElementById?

Is it possible to achieve the following code snippet? <div id="parent"> <iframe id="myFrame" title="HEY!" srcdoc="<div id='inner'>Hello World!</div>"></iframe> </div> v ...

Copying JSON Data in JavaScript: A Guide

Seeking advice on how to duplicate JSON within the same JSON at various hierarchy levels. Take a look at this example JSON below: Initial code snippet looks like this: { "data": { "moduleName": { "content": { "modul ...

Incorporating a basic search feature into Ajax

At the moment, only results appear when you modify the query. I want to modify this to allow user input. I have set up the fields, but I need help adjusting my ajax code to accept the new search criteria which is crucial for functionality. This is what m ...

Stop the occurrence of OpenCPU javascript error pop-up notifications

I'm currently experiencing an error related to CORs during a test deployment of OpenCPU. While I may create a separate question for this issue in the future, for now, I am wondering if it is possible for the deployment to fail without alerting the end ...

How are objects typically created in Node.js applications?

These code snippets are from Node.js tests, and I am curious about why one method of instantiating an object is favored over another? // 1 var events = require('events'); var emitter = new events.EventEmitter(); emitter.on('test', doSo ...

The gif loader persists even after subscribing

Looking to incorporate the SendGrid subscription widget into my site, but struggling with the implementation. The code provided by SendGrid is partially functional - the loader appears and a success message is displayed upon sign up, but the GIF loader doe ...

Is it considered fundamentally inappropriate to call $scope.$digest within $scope.$on?

I recently inherited some AngularJS code, and my knowledge of both the codebase and Angular itself is limited. Within the code I inherited, there are instances where $scope.$digest is being called inside a $scope.$on method within a controller. Here's ...

Getting real-time comments after they have been submitted in ReactJS

Is it possible to dynamically display newly added comments in real-time without refreshing the page after submitting them to the database through an API? Here's a snippet of the code I currently have: const PostWidget = ({ post }) => { ...

Position the previous and next buttons next to the thumbnail images

I've implemented the cycle2 jQuery plugin on my website successfully, but I'm facing an issue with positioning the prev and next buttons next to my thumbnails. I want them to be aligned with the first and last thumbnail without relying on absolut ...

Remove elements generated by the .after method with Jquery

In my HTML file, I have a table with hard-coded column headers: <table id="debugger-table"> <tr> <th>Attribute</th> <th>Computed</th> <th>Correct</th> </tr> </table&g ...

The Arrival of Link: A Countdown Timer

I'm attempting to create a countdown timer that reveals a link after 20 minutes. Currently, this is my progress... <script type="text/javascript"> window.onload = function() { countDown('my_div1', '<a href="cdtl.html" ...

What is the best way to prevent certain search terms from appearing in search results on my website's search form

Is there a way to prevent certain search terms from showing up in my search box? For example, how can I block the search query for "dog"? <form id="headbar-search" action="search.php" method="GET" x-webkit-speech="x-webkit-speech"> <input type="t ...

Is purchasing a Twilio phone for sending SMS messages a good idea?

As part of my testing process, I have implemented this code for sending SMS messages. Everything is working fine so far, but I have a question regarding the necessity of purchasing a Twilio phone number to input into the "from" field. I intend to send real ...

Ensure that every route is prefixed with /api

Is there a way to set all routes accepted by Express to start with /api without explicitly defining it? Current: this.app.get('/api/endpoint-A', (req, res) => { return res.send('A'); }); this.app.get('/api/endpoint-B', ...