Updating matrix after cloning in Three.js: a guide for using with CSG ThreeBSP

Having an issue with scaling a cloned mesh immediately for programming purposes using CSG ThreeBSP. It seems that the cloned object's properties are not updating right away after scaling. Is there a function I should call to force the matrix or other internal variables to recalculate immediately without waiting for the render update loop?

Here is a snippet of my code:

var someMesh2 = someMesh1.clone();
someMesh2.scale.set(2,2,2);
someProgrammingOperation(someMesh2);
//Internally, someMesh2 still retains the properties of someMesh1 :(

Any suggestions on what I might be missing here? Your input is much appreciated!

javascriptthree.jscsgthreecsg

Answer №1

object.matrix is automatically updated by the renderer every time you invoke renderer.render().

In case you need to manually update the object matrix, simply call

object.updateMatrix();

This will synchronize the matrix with the current values of object.position, object.quaternion, and object.scale.

(Please note that object.rotation and object.quaternion are kept in sync. Updating one will automatically update the other.)

Using three.js version r.84

Answer №2

After troubleshooting, I discovered that the CSG ThreeBSP object needed to be based on the Geometry of the object, not the Mesh itself. Applying the scaling directly to the Geometry resolved my issue.

It's important to note that when working with meshes and geometries, it's essential to clone them to maintain the original objects. Here is an example of how to do this:

var newMesh = originalMesh.clone()
var newGeometry = newMesh.geometry.clone()
newMesh.geometry = newGeometry
newMesh.geometry.scale(2, 2, 2)

var someBsp = new ThreeBSP(newMesh)

var finalMesh = someBsp.toMesh()
scene.add(finalMesh)

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

An issue arises in React TypeScript where a callback function is encountering undefined values when using setState, but surprisingly logs the

Struggling with a React application I'm building, specifically with an issue that's got me stumped. Here's a snippet of code that's causing trouble: onFirstNameChange(event: any){ console.log(event.target.value) // this.setState ...

javascriptreactjstypescript

What is the reason behind having 3 watchers for 1 binding in AngularJS?

Take a moment to view the screenshot provided below https://i.sstatic.net/qLcem.png In the screenshot, it is evident that there are #3 watchers for a single binding. Would someone care to explain the reason behind this? P.S: I am utilizing AngularJS Ba ...

javascriptangularjsangularjs-watchangularjs-bindings

The HTTP request is being executed twice for some reason unknown to me

import React, {useState, useEffect} from 'react' export function UseStateExample() { // This is a named export that must be used consistently with {} when importing/exporting. const [resourceType, setResourceType] = useState(null) useEffect ...

javascriptreactjsapirestreact-hooks

Transfer a JSON object to a Java Class without relying on a servlet

I have a form in HTML where I collect user input and store it as an object in JavaScript. Here is how I am creating the object: var dataObject = { Name: getName(), Age : getAge() } Now, I want to send this object using Ajax to a b ...

javascriptjavajsonajaxweb

Cannot find WoopraTracker within the custom event data

I am currently working on implementing Woopra custom event data upon page load by following their guidelines. I have attempted to push events when the page is ready, however, it keeps returning an error that woopratracker is not defined. Strangely, when ...

javascriptanalytics

Angular: When $scope variable is modified, a blank page issue arises

In my Angular application, I have a template called viewAll.html that is displayed after clicking on a link. This template fetches data via AJAX using scope variables. However, I encountered an issue where updating these scope variables through AJAX cause ...

javascriptangularjsajax

When the application is reloaded, will the localStorage data be reset or remain intact?

Looking for a way to store data consistently throughout my application, I've opted to use localStorage. However, I'm facing an issue where all the localStorage values are erased upon reloading the browser. Can someone shed some light on why this ...

javascriptjqueryangularjshtml

Explore and adjust the contents of a complex and nested JavaScript object

In my dataset, there are objects nested deeply with arrays, objects within arrays, and so on. Each nested object includes a property called sys, which contains another property called id. I have a list of specific id values that I want to remove from the ...

javascriptjsonrecursionjavascript-objectstraversal

Steps to develop a log-in API using Node.js

In the process of developing my web application, I have utilized node js exclusively for all functionalities and the web user interface has been successfully implemented. An issue that has come to light is that users are able to access the services API wi ...

javascriptnode.js

Stop the unnecessary reloading of Ajax data when navigating back using the browser's back button in Chrome and Internet Explorer

I am currently designing a website where the main page showcases the latest 10 blog entries. As I scroll down and approach the end of the last item on the screen, another set of 10 blog entries automatically load through infinite scrolling. If a user clic ...

javascriptjqueryajaxback-buttoninfinite-scroll

When attempting to use a context, the type '...' cannot be assigned to type '...'

In my Next.js project, I am utilizing createContext to implement a dark mode button. The original jsx file for this functionality is called ThemeContext.tsx, and I am currently in the process of converting it to TypeScript. "use client"; import ...

javascriptreactjstypescriptnext.js

Using conditional subscriptions in Meteor at the template level

When working with the same template in different routes using a conditional publication method, I encountered an issue where the data was not being subscribed to as expected. The console log returned an empty array. server/publication.js Meteor.publish(& ...

javascriptnode.jsmongodbmeteorflow-router

When attempting to connect to http://localhost:8545/ using Web3.js, the network encountered an error with the message

I am currently working on setting up web3.js for a website in order to enable Ethereum authentication. However, I encountered the following error: web3-light.js:4327 OPTIONS http://localhost:8545/ net::ERR_CONNECTION_REFUSED HttpProvider.send @ web3- ...

javascriptnode.jsweb3js

Altering the color of a Fabulous Icon in real-time

I'm having trouble changing the color of an Awesome Icon with this code I created. Instead of getting the desired color, I am getting 'undefined' as a result. <script type="text/javascript"> function changeAIColor(idName) { alert ...

javascriptjqueryhtmlthymeleaffont-awesome

Troubleshooting a Vue.js formatting problem in Visual Studio 2019

Encountering an issue with VS2019 while attempting to format this code section. <%@ Control Language="C#" AutoEventWireup="true" CodeBehind="milestone.ascx.cs" Inherits="uc.dms.milestone" %> <section class="content-header"> <h1> ...

javascriptc#htmlvue.jsvisual-studio-2019

How to retrieve a value only if it is truthy in JavaScript or TypeScript - Understanding the operator

In React components, a common scenario arises with code like this: <Carousel interval={modalOpen ? null : 8000}> It would be great if I could simplify it to something along these lines (although it's not valid): <Carousel interval={modalOpen ...

javascripttypescript

When you set the href attribute, you are essentially changing the destination of the link

UPDATE: I'm not referring to the status bar; instead, I'm talking about the clickable text that leads to a link. /UPDATE I've gone through a few similar posts but couldn't find a solution. I have a link that needs to be displayed. www ...

javascriptjqueryhtmlhref

Having trouble with the @keyup event not functioning properly in Vue?

I'm attempting to trigger a method when the enter key is pressed, but for some reason it's not working. Here's the code snippet: <template> <div> <button @click="callEvent" @keyup.enter="callEvent"> Click </button ...

javascriptvue.js

Refreshing the MarkerCluster following an AJAX request

My current challenge involves an AJAX function that retrieves posts based on users with a specific role. While the query itself works fine, I am encountering an issue with refreshing the markers on Google Maps after the AJAX request is complete and the pos ...

javascriptjqueryajaxwordpressgoogle-maps

When building with Angular using the "ng build" command, the JavaScript file names are altered

I'm currently learning Angular and I've noticed that when creating a new project with Angular CLI, files like runtime.js, polyfills.js, main.js, styles.css are generated. However, after running the ng build command, similar files can be found in ...

javascriptangularexpress