The attributes for CylinderGeometry in THREE.js are not specified

I've encountered an issue with accessing the .attributes.position for geometry in THREE.js. The console is returning an error message: 'Uncaught TypeError: Cannot read properties of undefined (reading 'position')'.

const cylinderGeometry = new THREE.CylinderGeometry( 5, 5, 5, 5, 15, 5, 30 );
const position = cylinderGeometry.attributes.position;
const vertex = new THREE.Vector3();

This code snippet is referenced from .

Any thoughts on why this issue might arise? Could it be related to the version of THREE.js that I'm currently using?

Answer №1

If you're working with Three.js version r125 or higher, accessing the position attribute of any geometry is straightforward. You can do so using the `.getAttribute()` method.:

const cylinderGeometry = new THREE.CylinderGeometry( 5, 5, 5, 5, 15, 5, 30 );
const posAttribute = cylinderGeometry.getAttribute("position");
const posArray = posAttribute.array;

In case you are using a version older than r124, the way Geometry was structured has changed. The deprecated approach should be updated to a newer version for better compatibility and functionality.

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

Transferring information from a method within a controller to a method within a directive using Angular

I am facing an issue in my Angular application where the data retrieved from an API is not being passed properly from a controller function to a directive function. Despite using .then() to ensure sequential execution, I still receive 'undefined' ...

Adjust choices in a dropdown menu based on the selection of another dropdown menu

I am attempting to create a scenario where selecting an option from one dropdown list will dynamically change the options available in the next dropdown list. You can find my code on jsfiddle <!DOCTYPE html> <html> <body> &l ...

Struggling to successfully deploy an Angular application on Azure

I'm currently in the process of deploying my Angular app to Azure. Utilizing VS Code and the "Azure App Service" extension. I have diligently followed this guide step by step: Upon completing the guide, I was successful in deploying the Angular app ...

Concentrate on input fields within Vuetify's expansion panels

Struggling to achieve input focus inside v-expansion-panels upon hitting enter? While I've successfully made the next expansion panel open and accessed the input via the $refs API, I'm unable to make the input focus. Check out a snippet of my cod ...

Adjust the position of bespoke shapes in Three.js to the central origin

After converting some custom geometries from a STEP file, I have been using the mouse to rotate them. However, they currently rotate around the scene's origin, making it appear as though they are rotating on a virtual sphere due to their distance from ...

Introducing a script tag using ngBindHtml functionality

My current dilemma involves utilizing external API data that consists of user generated content. My client's request is to dynamically update their website with this feed, while also allowing the use of JavaScript. <div ng-bind-html="post.content" ...

I'm perplexed as to why my JavaScript code isn't successfully adding data to my database

Recently, I delved into the world of NodeJS and Express. My goal was to utilize Node and Express along with MongoDB to establish a server and APIs for adding data to the database. Specifically, I aimed to write the code in ESmodules syntax for JavaScript. ...

What is the best way to deploy a nodejs expressjs application to a server?

I have successfully developed a nodejs and express application that works perfectly on my localhost. To start the application, I simply run the command npm start or node index.js. Recently, I uploaded all the necessary files, including node_modules, to a ...

Guide on incorporating an Ajax spinner to a Slideshow

I am in need of assistance with creating a manual slideshow that includes an ajax loader image. The goal is to display the loader image every time I click on the Previous or Next buttons, until the Test 1, Test 2, and Test 3 texts are fully loaded. Any sug ...

An unidentified non-space character appeared following the JSON data on line 1, which was unexpected and at column

I am currently working on a WordPress site locally and my goal is to develop a hybrid app for it using AngularJS. Within WordPress, I have created a plugin to retrieve data. The metadata comes in the form of an array: (...) After converting this complex ...

JavaScript generated form fails to submit

I am currently facing an issue with submitting form data to a PHP file when it is generated using JavaScript. I am unsure of how to resolve this problem. The form submission works fine on a test .html file by itself, but not when it is generated by JavaScr ...

The significance of zone.js and rxjs within the context of Angular 2

As a newcomer to Angular2, I recently learned about zone.js and rxjs. I'm curious to know if they both serve the same purpose for handling asynchronous tasks, or if each has its own specific role. Can someone explain to me the exact reasons why zone.j ...

Tips for showcasing req.validationError in a form

I am currently working on validating a sign-up page using node.js/express. My main goal is to show the error messages generated by req.validationErrors() directly on my form. I have opted to use ejs instead of jade, and while I found a solution for display ...

Implementing auto-complete functionality for a text box in an MVC application using jQuery

After incorporating code for auto completion in a text box using AJAX results, the following code was utilized: HTML: <div class="form-group col-xs-15"> <input type="text" class="form-control" id="tableOneTextBox" placeholder="Value" > ...

What might be the reason for jQuery not functioning in Internet Explorer 11?

Working on developing a slideout menu for my website using jQuery. It functions perfectly in Chrome, but encountering issues in Internet Explorer (IE11). Extensive search hasn't provided a solution yet. Seeking assistance and any help would be highly ...

Creating a dynamic JSON object and retrieving the response in a JSP for data-driven documents

I am a beginner with the D3 API and I need to create a tree-like structure using a JSON file with hardcoded values. Additionally, I have a servlet that retrieves some values from a database which I want to dynamically convert into JSON in the servlet and s ...

What is the best way to incorporate a generated ID into the datepicker() function whenever a button is clicked?

I'm looking to dynamically generate a row of input fields with unique IDs every time the "add another flight" button is clicked, similar to the functionality seen on destina.us. Additionally, I need to incorporate these generated IDs into the jQuery U ...

When using fs.readFileSync, the error message "no such file or directory" may appear even though the file is successfully returned when using require()

Looking to dynamically read a JSON file poses a challenge with the traditional require() method. The issue lies in the fact that the file is not updated until the NodeJS server is restarted, prompting the need to utilize fs.readFile or fs.readFileSync. Wh ...

`Next.js project experiencing issues with scroll trigger functionality`

I've been working on a gsap animation with a scroll trigger, and while the animation itself functions fine, it's not triggering as expected. The AnimationEffect code involves using gsap and scrolltrigger to create the animation. The Hero section ...

Adding properties to a class object in Javascript that are integral to the class

Recently, I've been contemplating the feasibility of achieving a certain task in JavaScript. Given my limited experience in the realm of JavaScript, I appreciate your patience as I navigate through this. To illustrate what I am aiming for, here' ...