Questions tagged [three.js]
Three.js is a lightweight cross-browser JavaScript library/API used to create and display animated 3D computer graphics on a Web browser. Three.js scripts may be used in conjunction with the HTML5 canvas element, SVG or WebGL.
three.js
21,195
questions
-2
votes
0
answers
11
views
Three.js Globe that only works when placed on top
This world map only works when you put it at the top of the website. I wonder why?
It doesn't work when I put it towards the middle of the site, but it works when I put it at the top.
I want it to ...
- 1
0
votes
0
answers
36
views
Some of three object are crashing
I'm using react three/drei library to render some 3d objects in my website , on desktop they're all rendering correctly but in mobile some of them are crashing and not displayed properly , i asked ...
- 3
-3
votes
1
answer
46
views
I need help on why my three.js code isn't working [closed]
I want to learn three.js and tried following the getting started code on the three.js documentation, but the scene isn't rendering, and I am completely stumped.
index.html:
<!DOCTYPE html>
<...
- 1,592
0
votes
1
answer
88
views
'Text could not be created' error running three.js example on Edge with WebGL context
Running three.js on Edge displays 'text could not be created. Reason: Could not create a WebGL context
I tried running the official three.js example on Edge, but I encountered an error stating 'text ...
- 1
2
votes
2
answers
4k
views
React-Three-Fiber sending uniforms to custom shader with TypeScript
Im converting to TypeScript and I cant seem to get uniform sent into shader. There are no errors anywhere and everything runs but uniform is not updating, nor is it really being sent in the first ...
- 1
-1
votes
0
answers
28
views
When using PlaneGeometry with ShaderMaterila my browser throws "Program Info Log: Fragment shader is not compiled."
I am new to Three.js and running on version 0.167.0 of Three.js.
I am trying to create a PlaneGeometry with ShaderMaterial, but I get an error and nothing renders in the scene.
Here is my code snippet....
- 1,592
0
votes
0
answers
22
views
THREE.OrbitControls is not a constructor, THREE is not defined
I am developing a Dash app with a ThreeJS component embedded. This is not the final project, but an example. I dont know to fix this, since I have tried a lot of things and ChatGPT, Gemini and Claude ...
- 3
-1
votes
0
answers
7
views
border around 2D shape shader
I am writing a shader for threeJS to draw a frame around a shape geometry, (usually a rotated rectangle but could have point points potentially).
I am passing the corners -2D points- to the shader ...
0
votes
0
answers
22
views
Scaling issue with cylinder created from blender scaled using three js
I have an OBJ file created using Blender. I need to scale it using Three.js. The scaling works well for cube-like objects, but cylinder-type objects are not scaling correctly. Please correct this.&...
-1
votes
0
answers
23
views
Error loading model on website served through GitHub pages: SyntaxError: Unexpected token 'v'
so I'm fairly new to coding, GitHub pages all of it. I am trying to serve my website over there which includes three 3d models (their files being larger than 100mb) which I have added to the git ...
- 209k
1
vote
1
answer
46
views
Showing stats of vertices and triangle counts on editor
In the example editor how does Three.js rendering a legend showing the number of Vertices and Triangles and also a 3 axes helper legend, I added screen shot of the scene with these legends.
I want to ...
- 1,592
1
vote
0
answers
34
views
I can load GLTF files from a URL asynchronously. I want to do the same with drag/drop GLTF files
The code I am working on supports loading GLTF models from remote URLs. I made a small async function that also adds some meta data to the GLTF object which is used later.
It works great.
Now, I want ...
- 158
6
votes
4
answers
6k
views
How to manually control animation frame by frame?
Regarding this Three.js example https://threejs.org/examples/#webgl_animation_keyframes I was able to load my own model and play animation in a loop. However I want to make a "slider" that will allow ...
- 6,616
1
vote
0
answers
23
views
How can I convert MediaPipe's normalized screen space coordinates to world space meters?
I'm trying to create a web application in React JS that uses MediaPipe to track facial landmarks and then displays a 3D model in A-Frame, aligned with the face.
MediaPipe provides facial landmark ...
- 127
0
votes
1
answer
36
views
How to make orbit controls' center something other than the center of the canvas?
I want to rotate an object or the camera around the center of an object, however the object is not placed in the center of the canvas, a little to the left. So using OrbitControls is making the object ...
