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,196
questions
0
votes
0
answers
23
views
Link device's gyroscopic orientation with that of 3d model on web
I am trying to build a model rocket that uses an old phone for reading gyroscopic data using a webapp (Flask and flask-socketIO). the "rocket phone" goes to /rocket and sends gyroscope data ...
0
votes
0
answers
19
views
Three.js sprite in mapbox combine
mapbox-gl-js version: 3.4.3
browser: chrome 126
Steps to Trigger Behavior
I used the example Add a 3D model use threejs of official website to add sprite, but the display is not correct and I can't ...
0
votes
0
answers
31
views
How to put a shapeGeometry background image in threejs
I searched various places and did not get the results i wanted. Thre reason why I changed gemetry to shape is that the position of each vertext of the obect, that is. the value in points can be ...
0
votes
0
answers
12
views
three.js set break when using Line2 and LineMaterial
I have a bunch of points that are part of each cube face and are set in consecutive order.
when passing all those points to the LineGeometry there is a diagonal line as a result of connecting all the ...
1
vote
1
answer
30
views
three.js fat lines - line width is exaggerated
I've just followed this fat line tutorial from threejs examples
https://github.com/mrdoob/three.js/blob/master/examples/webgl_lines_fat.html#L105
However, when setting the code the line gets rendered ...
0
votes
1
answer
28
views
Edges geometry - Draw boundary edges from a mesh that is not located at the origin
So I have a cube mesh placed at a random location:
mesh.position.set(target.x, target.y, target.z);
scene.add(mesh);
I want to draw its edge lines in that location. I tried using EdgeGeometry as ...
0
votes
0
answers
32
views
Three.js render the boundary lines of a cube mesh [duplicate]
I tried setting the wireframe prop as true to render the edges as lines. However, since the mesh is made out of triangles, all it's edges get visible. I only want to render the boundary lines from the ...
-1
votes
0
answers
39
views
Change animation scale and position with Blender Python
I'm working with 3D in SceneKit, iOS.
For my scene I take a glb model from my provider and animation for it in dae format from mixamo.com.
Problem: when I try to apply the animation on my model, it ...
0
votes
0
answers
27
views
Three.js outlinePass add-on not working when implemented with R3F
I'm having a hard time using the R3F -postprocessing library so I decided to use raw threejs classes:
By diving into the R3F extending third party library tutorials I managed to setup the renderPass ...
0
votes
1
answer
58
views
Normal map BG image for website, with fixed light source
I would like to be able to use normal maps in my site's background images. This CodePen example seems to be the best from all the implementations I've seen so far. It uses three.js to achieve the ...
0
votes
1
answer
45
views
React three fiber - setting up postprocessing using effectComposer and Passes (OutlinePass) from three.js addons
I'm having a hard time using the R3F -postprocessing library so I decided to use raw threejs classes:
By diving into the R3F extending third party library tutorials I managed to setup the renderPass ...
0
votes
1
answer
37
views
Threejs adding 1080p textures is rendered blurry
I am trying to render a sphere with a texture wrapped on it, i am using a png texture with 1920px1080p resolution but the resulted texture is always very blurry,
here is my sample code :
var ...
-1
votes
0
answers
18
views
R3F how can I get the camera controls through the hook get()
In a model class I'm calling the r3f hook get() to the camera controls
const { raycaster, camera, scene, gl, controls } =
ViewerModel._shared.viewerState!();
the console log prints it as a ...
0
votes
0
answers
18
views
Parametric Relationships: Walls, Floor in THREEJS
Does anyone know how to create interactive walls in Three.js that automatically adjust when a connected wall is manipulated? I have a room modeled as a GLB file, comprising four walls and a floor. For ...
-1
votes
0
answers
69
views
How to Load a .world Robot File Using Three.js in a Web Application?
I'm working on a web application and I need to load a .world robot file using Three.js. I've tried using the Collada loader but haven't been successful. Can anyone guide me on how to achieve this?
The ...