Three.js - Exploring the World of Geometric Vertex Manip

Having encountered an issue post utilizing the THREE.GeometryUtils.center(geometry) function, After successfully centering the mesh to the screen's central position using this function, my dilemma is that I now require the original vertices value that were present in the geometry before centering. Can anyone provide their valuable input?

Grateful for any assistance provided in advance.

Answer №1

Here is a solution:

  • Begin by calculating the midpoint of your shape.
  • Store this midpoint in a vector3.
  • Adjust the positioning of your shape within the scene to center it.
  • Utilize a translation movement back to the stored vector3 to return the shape to its original placement.

Answer №2

Would it be a good idea to duplicate the vertices prior to merging them?

let cloneVerts = [].concat(geometry.vertices);
THREE.GeometeryUtils.center(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

Navigate to a different position of a specified element within an expanding pivot grid

I'm currently dealing with a pivot table/grid that allows users to expand and collapse rows. My challenge is figuring out how to scroll to an expanded row after an expansion occurs. Typically, I use the following code for scrolling functions: ...

Is browserHistory.push ineffective in react.js?

I am currently working on a React ecommerce website. I have encountered an issue in the login component where, upon clicking the submit button on the form, the system is supposed to check if the user is authenticated using useEffect. If the user is authent ...

Trouble reading property 'map' in a react-redux todo application

Greetings! I am currently in the process of developing a to-do list application, but I have encountered the following error: TypeError: Cannot read property 'map' of undefined Below is the code snippet where the error occurs: 4 | function T ...

Issue with showing multiple images on HTML page

I'm currently working on enhancing my webpage by enabling the upload of multiple images. However, I'm facing challenges in figuring out how to obtain a valid URL for the image source and to verify if the correct number of files have been uploaded ...

Setting up Highcharts version 7 heatmaps with npm in an Angular 6 environment

I am currently having an issue with initializing the heatmap lib in Highcharts 7.0.1 within my Angular 6 app via npm. Despite successfully running basic charts like line, spline, bar, etc., when following the documentation for the heatmap initialization, I ...

Tips for creating a hyperlink to a particular tab

Please click here for the demo I am attempting to generate links like this page1.html#section1, page2.html#section2, but these links are not functioning correctly. Relevant code snippet function showSection( sectionID ) { $('div.section'). ...

Where might I locate the source files for a compass in a Windows operating system?

Is there a way to access certain compass mixins without actually including the entire compass library in my project? I'd prefer not to have to import compass directly, like in these examples: @import "compass"; @import "compass/reset"; @import "co ...

Chargebee encountered an error of type TypeError when attempting to create a subscription. The action

Every time I attempt to send a request with Chargebee, an error appears. Error: Failed to create subscription async createSubscriptionForTeamMember(customerId, options) { try { // Proceed with subscription creation using Chargebee API ...

Steps for implementing AJAX call tracking with Google Analytics

After setting up my Google Analytics account and adding the provided code to my index.php file, I noticed calls to www.google-analytics.com in Firebug. It seems like everything is working correctly. Now, I want to track how many times the 'functions. ...

creating a custom type with enums in Angular can lead to implicit 'any' issues

Why does the key of [type] require a type? It may sound strange, but I am facing an issue. Here is some example data: export enum ENUM_Bike { suzuki = 'suzuki', yamaha = 'yamaha', kawasaki = 'kawasaki' } export type T ...

Avoid refreshing the page while submitting the data in the form

Trying to submit form data without page refresh and display a jQuery dialog upon completion. This is the original code: <script> $( function() { $('#dialog-message').dialog({ autoOpen: false, title: 'Basic Dialog&a ...

Error: Trying to call an undefined function

Having trouble with an error on this line: $("#register-form").validate. Can anyone offer assistance? Furthermore, if I write this script, how should I incorporate it into the form? Will it function without being called? <script type="text/javascript ...

What are some ways I can customize this jQuery :submit selector demonstration?

After reviewing the jQuery example provided here, I am curious about how to adjust the code in order to change the color of a cell only when the value of the submit button within that cell meets certain criteria. For instance: var submitEl = $( ...

Traverse the data() object in jQuery to retrieve both keys and values simultaneously

I have a data() object with some JSON content. Is there a way to iterate through the object and extract each key and value pair? Here's my current code snippet: function getFigures() { var propertyValue = getUrlVars()["propertyValue"]; $.getJSON( ...

Seeking guidance on implementing image captions with jquery

I've been searching high and low for a caption similar to this for quite some time. However, I am interested in tweaking the opacity of the background to 50%, increasing it to 90% on hover, and adding a semi-pulsating text effect. Can anyone assist me ...

Create a list that starts with a header determined by an object's attribute within an array

Currently in Vue, I am attempting to create a list based on a specific property within an object. The array being retrieved from the vuex store is structured as follows: const array = [ { name: "British title string" nationality: "British" }, { ...

Is it possible to dynamically insert a ng-mouseover in AngularJS using Javascript?

It seems like there is an issue with this code: var run_div = document.createElement('div'); run_div.className = 'whatever'; run_div.textContent = 'whatever'; run_div.setAttribute('ng-mouseover', 'console.log(&b ...

Ensure that you do not repeat the same action

In my application built on Node.js, I am utilizing Express for API routes and MongoDB as the database. One of the functionalities includes a raffle where users should only be able to enter once. Currently, I am storing participant information in an arra ...

Difficulty encountered while trying to access JSON object

I've been utilizing the LinkedIn JS API to retrieve a list of individuals. The data is returned in JSON format, and here is the callback function: .result(function (result) { profile = result.values[0]; // Perform an action with the f ...

Find elements that contain a particular keyword in their href attribute and conceal any others (using JavaScript)

I am attempting to create a search box for a webpage where users can enter a keyword, and my code will search that keyword in the href of all elements. It will then hide any elements that do not contain the keyword in their href. I have implemented a Java ...