What is the process for adjusting the scale value in pixels?

Is there a way to adjust the object's scale based on pixel value using three.js?

object.scale.set(0.05,0.05,0.05);

I am aiming to set the size at 0.05 pixels.

Answer №1

Allow me to rephrase your query, and do correct me if I have misunderstood:

It seems you are looking to use specific pixel values rather than relative values to determine the size of an object on the screen.

The challenge here lies in the fact that three.js (or WebGL) does not inherently operate with pixels as a unit of measurement internally.

The perceived size of an object on the screen is influenced by various factors:

  • The CSS size of the canvas element and the devicePixelRatio
  • The dimensions of the canvas element
  • The physical size of the object
  • The camera's position and other properties (such as aspect ratio, field of view, and spatial relationship to the object)

In 3D graphics, the concept of pixels loses its conventional meaning. While you can utilize any unit for sizes and positions, they may not directly correlate to pixels on the screen.

You might find this answer helpful: THREE.JS: Get object size with respect to camera and object position on screen

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

Steer clear of utilizing Number() when working with scientific notation

I am attempting to perform the following task Number("0.00000000000122") yields 1.22e-12 However, my goal is to convert that number from a String to a Number. console.log(Number("0.00000000000122")) ...

What are the necessary headers that must accompany a post request?

While testing the server with Postman, everything seems to be working fine as I receive a response: https://i.stack.imgur.com/yMRfj.png However, when attempting to make a POST request from the browser using the same address, it results in an error and th ...

What is the recommended approach for running a Node.js application in a production environment on a Windows operating system?

I am currently working on a Node.js application that needs to run on a Windows Server. During development, we usually start the app by running a command in either the command-line or PowerShell: node index.js What is the most efficient and recommended way ...

Can anyone explain why I am having trouble loading JavaScript files into a different HTML file?

Currently, I am developing an electron application. In my index.html file, I have successfully loaded JavaScript files in the head tag and can access the JS functions without any problems. Now, I have created a separate browser window with another HTML fi ...

Top strategies for efficiently managing the loading of extensive PHP pages using Jquery, Ajax, HTML, and other tools

Hey there, I hope you're doing well in this new year. I've been working on a project that creates a "league table" using a large amount of data, similar to those seen in sports like football. The backend is built in PHP to process the data and d ...

Update the image source every 1 second with Jquery and Javascript

I've been experimenting with creating a script that dynamically changes the source of an image every two seconds based on a list. Essentially, my current approach involves using a for loop to iterate over the provided list: $(document).ready(functio ...

Tips for eliminating the domain name from the src URL attribute using Jquery

Is there a way to extract the img src attribute and retrieve only the image path without the domain name included? var imgurl = "http://nitseditor.dev/img/home/bg.jpg"; For instance, I would like to display img/home/bg.jpg instead of the full URL. Any id ...

Attempting to design a form that will trigger a print dialog box displaying all the information entered in the form

I am currently working on developing a form that will allow users to input information such as Name, Age, Gender, Hobbies, Contact details, and Photo in order to create a resume. My goal is to build a simple local HTML-based application that generates a RE ...

Having difficulty with utilizing array.every() properly, leading to inaccurate results

Struggling to validate an array of IDs using a custom validator in a nestjs project. The issue arises when passing the array of IDs to a service class for database querying, as the validation always returns true even with incorrect IDs. Snippet of the cus ...

jquery mobile listview extension not functioning as expected

My JQM menu is displayed as a listview, and I want it to be normal on every page except one where it should have 2 extra items. Despite searching online for solutions, nothing seems to work. Here are some of the things I've attempted: -location.reloa ...

Distinguishing between selecting rows and selecting checkboxes in Mui Data Grid

Is there a way to differentiate between clicking on a row and clicking on the checkboxes? I want to be able to select multiple rows by clicking anywhere in the row except for the checkbox column. When clicking outside the checkbox column, I would like to p ...

Tips for inserting a delay between two separate javascript commands within the same onchange event

Within my HTML code, I have an input field that triggers an onchange event: <input type="text" value="2014-01-01" class="datepicker dateDashboard" onchange="repartiteur('DatesDashboard',$(this));document.location.href='index.php?menu=17| ...

Vue paginated select with dynamic data loading

My API has a endpoint that provides a list of countries. The endpoint accepts the following query parameters: searchQuery // optional search string startFrom // index to start from count // number of options to return For example, a request with searchQu ...

Using regular expressions in JavaScript to work with numbers separated by commas, as well as their comparison operators such as greater than, greater than or

Currently, I have implemented this Regex pattern to validate numbers with decimals (comma separated) /(^\d*\,?\d*[1-9]+\d*$)|(^[1-9]+\d*\,\d*$)/ However, I am now faced with the need to modify it in order to also valida ...

Guide on displaying applicant name in the show route of your node.js/mongoDB application

Currently working on a website where applications are being accepted. In the admin panel, I want to display a list of all applicants and allow users to click on a name to view more information. However, I'm facing an issue where the same applicant is ...

How to add a service to a static function in Angular

After incorporating a logger service into my project, I have encountered an issue with using it in NGXS static selectors. The selectors in NGXS are static methods, which prevent me from accessing the logger service injected via Angular DI. Are there any e ...

Is it possible to fulfill a promise within an if statement?

I'm fairly new to using promises in JavaScript, and I am currently facing an issue where a function needs to execute before running some additional code in another function. The problem arises when the promised function includes an if statement that l ...

A helpful guide on resetting ReactJs to its default state when data is not found

Currently, I'm fetching data from my database, but just for the sake of this question, I have opted to manually create an example with fake data. I am in the process of creating a search bar for my users to navigate through all the data retrieved fro ...

The VueJS app seems to be experiencing difficulties with rendering the content

Just starting out with VueJS and I have my initial files - index.html and index.js. I want to stick with just these two files and not add any more. Here's the content of index.html: <html lang="en"> <head> <meta charset ...

The Evolution of Alternatives to contentEditable

Related: ContentEditable Alternative I am curious about the timeline of online WYSIWYG editors prior to the existence of contentEditable. I remember using GDocs and GMail with rich-text features that functioned similarly to contentEditable. I would appre ...