threejs | Threejs basic example Demo | Animation library

I'm a beginner to three.js and I'm using Angular 13 with three.js v0.137.0. I'm trying to load and preview a ply file from a data URL. When the object is rendered, it is only showing like lines as in the screenshot. screenshot - how the ply file renders.

I imported the .ply file that I'm trying to preview from the editor at https://threejs.org/editor and it loads the same .ply file perfectly. how the file renders in three.js editor

What am I doing wrong here?

Structure of my project 66% threejs model, 44% html (side control) using Bootstrap. I’m trying to make mouse picker, when pointing at an object so that it is shown on which object it is pointed. As I understand it, he sees the coordination of the mouse badly. Please help me figure out and set up the correct coordination mouse with Canvas.

Project Structure Screenshot:

Code:

I have a piece of code from 3 years ago that appears to not be working anymore from Three.js.

I have updated all of the other issues of the migration to ES6 for Three.js, but when I try to add as I did in the past more than 1 place marker on the planet surface, only 1 place marker is displayed, with only the last added place marker being successfully displayed in the desired position... with all other place markers being erased.

Problem example -> https://jsfiddle.net/jhL6s579/6/

Complete code:

HTML

I manage a WordPress website which uses a Three.js animation on the homepage. I built this site months ago and everything had been working perfectly fine - I even showed it to someone a week ago and nothing was amiss. Yesterday, I check the site and find that Three is not loading, and that I have this in the console:

Uncaught TypeError: Failed to resolve module specifier "three". Relative references must start with either "/", "./", or "../".

I don't have a line or even file to reference, the error is logged coming from the first line of the root domain. I want to emphasize that I had changed absolutely nothing about the set-up. I hadn't even updated to WP 5.9 yet. This is how I had originally set things up. Sorry if it's not best practices, but I want to emphasize that it did in fact work fine. Enqueuing animation javascript file and defining its type as "module":

I have the following project below created using ThreeJS. You will notice the gold object creates a shadow behind it on a sphere where I'm only rendering the backside so we can see the objects inside. I'm using a point light in the very center of the eye model to create the shadow evenly in all directions. This is the reason the shadow is curved.

I need to know how to get the 3D coordinates (x,y,z) of each pixel of this shadow that was created. For reference here is the code that creates the shadow with a lot removed for simplicity.

I have a weird issues with BufferGeometryUtils.mergeVertices method

I took a simple cube from a jsfiddle and performed the mergeVertices and it seems mergeVertices does not merge all identical vertices as it should. See https://jsfiddle.net/tomfree/vpdwmycn/

E.g. the vertices given in the indexGeometry returned by mergeVertices are

I want to add text to a can of beans. The example code uses render.copyTextureToTexture to blend textures together.

However, when I try to use it doesn't do anything.

When I tried to display textTexture on the cylinder it was fully transparent. Is the texture made before text is rendered in the first canvas?

Or do I need to somehow wait until the image is loaded and only then use copyTextureToTexture to add the text?

Thanks for taking the time to review my post. I hope that this post will not only yield results for myself but perhaps helps others too!

Currently I am working on a project involving pointclouds generated with photogrammetry. It consists of photos combined with laser scans. The software used in making the pointcloud is Reality Capture. Besides the pointcloud export one can export "Internal/External camera parameters" providing the ability of retrieving photos that are used to make up a certain 3D point in the pointcloud. Reality Capture isn't that well documented online and I have also posted in their forum regarding camera variables, perhaps it can be of use in solving the issue at hand?

Only a few variables listed in the camera parameters file are relevant (for now) in referencing camera positioning such as filename, x,y,alt for location, heading, pitch and roll as its rotation.

Currently the generated pointcloud is loaded into the browser compatible THREE.JS viewer after which the camera parameters .csv file is loaded and for each known photo a 'PerspectiveCamera' is spawned with a green cube. An example is shown below:

As a matter of fact you might already know what the issue might be based on the previous image (or the title of this post of course ;P) Just in case you might not have spotted it, the direction of the cameras is all wrong. Let me visualize it for you with shabby self-drawn vectors that rudimentary show in what direction it should be facing (Marked in red) and how it is currently vectored (green).

Row 37, DJI_0176.jpg is the most right camera with a red reference line row 38 is 177 etc. The last picture (Row 48 is DJI_189.jpg) and corresponds with the most left image of the clustured images (as I didn't draw the other two camera references within the image above I did not include the others).

When you copy the data below into an Excel sheet it should display correctly ^^

I'm playing around with WebGL. The following is a working example with a 3D object using Three.js. Is it possible to add multiple shaders to one 3D object, like this one? It would be highly appreciated if you can share some knowledge.

I just learned from one pro that helped with solutions to applying one shader material to 3D object. However, I'm curious about whether to add multiple shaders to give more effects to the 3D object.