How to update Three.js MultiplyVector3 method that has been deprecated

I've encountered an issue in three.js where the console displays this message:

DEPRECATED: Matrix4's .multiplyVector3() has been removed. Use vector.applyMatrix4( matrix ) or vector.applyProjection( matrix ) instead.

Unfortunately, I'm unsure of how to implement this change.

Below is my current code snippet:

 var rotation_matrixc = new THREE.Matrix4();
 rotation_matrixc.extractRotation(CHROMEboyPC.matrix);
 var cam_vectorc = new THREE.Vector3(    100 ,  30 ,  5);
 var   final_cam_vectorc = rotation_matrixc.multiplyVector3(cam_vectorc);
 camera.position.copy(CHROMEboy.position ).add(final_cam_vectorc   );
 camera.lookAt(CHROMEboy.position);

I need help rewriting the code using the recommended methods provided.

javascriptthree.jswebgl

Answer №1

Instead of the traditional notation, you can employ the following:

Implement the .applyMatrix3 or .applyMatrix4 function on the vectors to perform vector rotations.

var rotated_cam_vector = cam_vector.applyMatrix4( rotation_matrix );

Answer №2

In order to replace the multiplyVector3 function, we can streamline a following method and provide more clarity on the previous response:

The cameraOffset variable stores a Vector with the camera's relative positions in relation to the object being followed.

When referencing "player," we are indicating the specific object that is being followed. It may be necessary to adjust the offsets accordingly.

        var cameraOffset = new THREE.Vector3(0, 1, 2.5);

        // modify the camera offset based on the position of the followed object
        var new_cam_position = cameraOffset.applyMatrix4( player.matrix );

        // update the camera's position with the new calculated vector
        camera.position.copy(new_cam_position);

        // ensure the camera is looking at the player object
        camera.lookAt(player.position);

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

Top method for creating a checkbox filter to toggle the display of elements depending on various data-* attributes

I am currently working on creating a checkbox filter that will display or hide elements based on multiple data attributes assigned to those elements. Despite my attempts, I have not been able to achieve the desired filtering outcome. You can view a basic ...

javascriptjquerycheckboxfilterfiltering

What is the best way to include a character in a string if there are no instances of the same character already present?

Looking for help with a function that can determine if a string contains a period and add one if it doesn't. So far, I'm struggling to make it either continuously add periods or not add any at all. function checkPeriod() { if (inputString.indexO ...

javascriptstring

Select three random items from a string array list along with their corresponding indexes using TypeScript in Angular

Consider this example: I am working with a string array const groceries = [ 'milk', 'coriander', 'cucumber', 'eggplant', 'carrot', 'brinjal', 'on ...

javascriptangulartypescriptarraylist

Tips for choosing the following row in an Angular user interface grid

How can I deselect the currently selected row and select the one that follows it by clicking a button? I am using AngularHotkeys.js for this purpose. It gets even more complicated because I can sort the table with different columns. It would be helpful to ...

javascriptangularjs

Buttons in Laravel are shifting unexpectedly

There are three buttons available with different functions. <div class="form-group row mb-0"> <div class="col-md-6 offset-md-4"> <button type="submit" class="btn btn-primary"> {{ __('update') ...

javascriptphphtmllaravelbootstrap-4

What is preventing window.scrollTo() from being executed?

I have implemented Bootstrap's Buttons plugin to toggle the state of a custom checkbox. When the button is toggled on, a hidden element should appear at the top of the page and then the page should scroll to the top. Similarly, when the button is togg ...

javascriptjqueryhtmlcssbootstrap-4

Error encountered during webpack development build due to syntax issues

Having trouble building a project with webpack due to persistent syntax errors? It seems like when your friend runs the same code on Linux (while you're working on Windows 10), everything works fine without any errors. Here is the configuration for m ...

javascriptnode.jswindowsnpmwebpack

I'm encountering an issue with VUEJS components including my show route in their get call. How can I make my journals/:id pages function properly without encountering a Mime

I encountered a MIME type error stating: Refused to apply style from 'http://localhost:8080/journals/assets/css/main.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled. ...

javascripthtmlvue.js

Changing links dynamically through jQuery

Below is the dynamicpage.js script: $(function() { var newHash = "", $mainContent = $("#main-content"), $pageWrap = $("#page-wrap"), baseHeight = 0, $el; $pageWrap.height($pageWrap.height()); ba ...

javascriptjqueryhtmlcss

Stop input elements from receiving focus when the dialog is displayed on the webpage

I successfully integrated a dialog in my html code. My current goal is to: Within my dialog, there is a form with various form elements. Additionally, there is another form on the main page located underneath the dialog. Currently, when I press the tab ...

javascripthtmlcss

What is the correct way to execute a POST request?

Currently tackling a basic API project. Managed to nail the GET & DELETE requests, but the POST request is giving me a hard time. I'm almost positive it's a beginner mistake, but I can't seem to figure out the logic here. This specific file ...

javascriptnode.jsjsonpostman

Ways to segment into a proper array

I received the following object from an API and I am looking to convert it into an array using either JavaScript or C#. [ "1":"h1:first", "2":".content a > img", "3":"#content div p" ] I attempted converting it to a JSON object and using the spl ...

javascriptc#jqueryarrays

Numpad functionality in JQuery malfunctioning post-ajax request

Using the jQuery numpad plugin has been flawless until after an AJAX call. I have tried various functions like on('click') and others, but unfortunately, none of them worked as expected. Apologies for my poor English! You can find the extension l ...

javascriptjqueryhtmlajax

Cease the loading of a script in an HTML file

I have encountered a challenge in preventing a script from loading on my Wordpress website. The HTML file contains two scripts: <script type="0f1a6d7ca503db410c0d10c4-text/javascript" src='https://www.[-----------].se/wp-content/plugins/ ...

javascriptphpwordpress

Tips for arranging Intervals in sequence?

I've been developing a customized Pomodoro timer with user-defined work and rest times. In my Timer component, I have the following initial logic: useEffect(() => { start(3); start(timeData.workTime); start(timeData.restTime); }, []) c ...

javascriptreactjstimejsxsetinterval

Converting a string to a date in JavaScript

Is there a way to convert a string like "20150415" into a date with the format "2015, April, 15th"? I've come across multiple examples, but they all involve splitting with "-" or "/", which doesn't work for my case. Below is my current code snip ...

javascriptdate

What is the best approach to simultaneously update an array using multiple threads in a Node.js environment?

Hey there, I'm trying to figure out how to make changes to the same array using 2 worker threads in Node.js. Can anyone help me with this? My issue is that when I add a value in worker thread 1 and then try to access it in worker thread 2, the second ...

javascriptnode.jsmultithreadingworker-thread

Javascript code to verify whether the page is currently positioned at the top

How can I use JavaScript to determine if the page is at scroll(0,0)? I have a full-page slider that needs to pause when the page is no longer at the top. The page may not be scrolled manually, as there are internal HTML # links that could load the page d ...

javascriptscroll

Dropdown list remains open despite a selection being made

My problem arises when I attempt to select an item from the list, as the dropdown menu does not populate automatically and the list remains open. Here is the HTML code for the dropdown list: <label id='choose' for='options'>Sele ...

javascriptjqueryhtmldrop-down-menuhtml-select

Is there a way to individually invoke a function on every element within a webpage?

Every element in my database is accompanied by a distinct thumbnail for display purposes. To cater to user preferences, I have included a dropdown menu that triggers the display of different forms based on their selection through a function. However, my cu ...

javascriptjqueryhtmlnode.jshandlebars.js