Skip to main content
Just browsing Stack Overflow? Help us improve your experience. Sign up for research
Filter by
Sorted by
Tagged with
0 votes
0 answers
10 views

Using React Three CSG and Fiber, how can I use an uploaded STL file as the source for a subtraction?

I want to upload two stl files, and create a subtraction against the first stl using the second. When I upload a single stl and try to subtract using a Three based geometry it works well, but when I ...
Michael Etzel's user avatar
0 votes
0 answers
8 views

Markers Positioned Below the Surface of .glb Model in Three.js

I'm working on a Three.js project (React) using the @react-three/fiber and @react-three/drei libraries. My goal is to place markers on the surface of a terrain .glb model based on specific coordinates....
Fatima Waheed's user avatar
0 votes
0 answers
9 views

Cefsharp, fetch request gets blocked when mouse and keyboard events are firing

I'm using Three.js to render a 3D scene in my web application. After each rendering frame, I send a request to the server to see if any 3D objects have changed position. This is working as expected ...
AgentCodeBanks's user avatar
0 votes
1 answer
49 views

how to smooth transaction with animejs in three js when the target camera position move?

I had a button when the current position was on the top and then it moved to the bottom and centered with Vector3, but it was not smooth, it is like when we do display: none; to display: block for my ...
notnuyy's user avatar
  • 105
0 votes
0 answers
24 views

Implementing Raycasting in Gaussian Splatting Using Three.js

How can I place points at X, Y, Z coordinates in a 3D map using Three.js? I'm working with Gaussian Splatting representations, and right now, raycasting with a splat mesh doesn't work with Three.js's ...
Luis Julio's user avatar
0 votes
1 answer
70 views

Infinite marquee on a 3d/dynamic perspective path? Can it be done?

(perspective grid that might be useful to illustrate what I mean) I've been trying to create what I'd describe as a "dynamic perspective infinite marquee". Specifically I'm using this video ...
Ciaran Gutteridge's user avatar
0 votes
0 answers
20 views

How to add Event Listner to Aceternity UI Github Globe? [closed]

I'm building a 3d globe similar to Github using Aceternity UI I want to add Multiple Event Listners and Pointers to the globe. onMouseEnter: Revolving animation of the globe should be paused ...
Manjesh R V's user avatar
0 votes
0 answers
20 views

React-Three/Drei Html's 'occlude="blending"' prop hides Html, leva etc when post processing pass is used

I've found that setting Drei's Html component's prop occlude="blending", which seems to be the only way to currently get html/3d depth to place nice, will cause Html, Leva and any similar ...
Ocean Evers-Peete's user avatar
1 vote
2 answers
121 views

How i can make the object steady 180 degrees?

i have clothe object where user can rotation the cloth, i am using orbit control to rotation the object here, and the interface, user can change the color of clothe, there is a button to see the back ...
notnuyy's user avatar
  • 105
0 votes
0 answers
18 views

R3F / Rapier - How to use a Static Collider for First-Person Movement

I want to create a custom PlayerController for react-three-fiber by using rapier. I'm using a MouseMovement combined with KeyControls (WASD). I want a simple CapsuleCollider, to preventing the player ...
murcoder's user avatar
1 vote
0 answers
26 views

@react-three/fiber doesn't render the 3D model, leads to a blank screen

I'm trying to render a 3D animation using @react-three/fiber, @react-three/drei, and three. But it leads to an empty screen. No error logs are displayed. I checked whether WebGL was being supported by ...
Kanji's user avatar
  • 15
0 votes
1 answer
69 views

"Html" Component turning black after setting occlude to "blending"

pretty new to r3f but having a blast so far. I've run into a bit of an issue when rendering HTML into the scene with the drei helper. I'll drop the code from my render function below: <group ref={...
Ocean Evers-Peete's user avatar
-1 votes
0 answers
44 views

First image broken on mobiles while working on desktops in deployment [closed]

I’m encountering an issue with my portfolio on mobile devices after deployment. I’ve created nine cubes to represent different languages and frameworks, which display correctly on desktop. However, ...
Janessa Bao Tran's user avatar
0 votes
1 answer
68 views

How to make a three.js cube have different colors on different sides?

I am new to three.js, and in a program I am creating, I would like to make different colors for different sides of the cube. The arrow keys control cube rotation. For example, could I have red on one ...
TheOneAndOnlySammy's user avatar
0 votes
0 answers
73 views

How to find orienation of an object in a 2d Image

I have to detect some objects (Sofa and table in my case) and replace that objects from a 3d model. I am using YOLO to detect and LaMa to remove object and then trying to place the 3d model on the ...
Lalit Joshi's user avatar
1 vote
0 answers
40 views

How can I capture photo / video in WebXR threejs?

I want to capture photo / video while in AR mode . I am using webxr of threejs for the AR mode. I tried to take photos but it gave me black photos. I tried it using getUserMedia I don't know whether I ...
Dhruvil Mehta's user avatar
0 votes
0 answers
16 views

Three.js - Audio Issue on Firefox Browser

I am experiencing some audio playing issue on Three.js. I try my code on Safari, it works perfectly, but same website doesn't play sounds on Firefox. Has anyone experienced such a thing before?
Seckin's user avatar
  • 1
0 votes
0 answers
17 views

Why got null in useRef with 3dModel ReactThreeFiber GSAP? and how i can update it

gsap.registerPlugin(ScrollTrigger, useGSAP); const Scene = () => { const creamTubeRef = useRef<Group>(null); useGSAP(() => { const scrollTl = gsap.timeline({ defaults: ...
yanakorn sittiwan's user avatar
0 votes
0 answers
25 views

Getting surface point color in three.js

Could you please help me understand the capabilities of the framework? I have a 3d model, let's say it's a cube preloaded from .obj (or any other). The cube has different textures applied to each side....
Oleg  Zhmak's user avatar
0 votes
0 answers
14 views

AR Element in Model Viewer Appears Huge and Moves with User Instead of Being Stationary in Front — GLB/USDZ Issue or Model Viewer Configuration?

I am using model-viewer for displaying 3D models in AR on iOS and Android, but I'm facing an issue where the AR element appears huge and is not positioned in front of the user. Instead, it moves with ...
Artglow Team's user avatar
0 votes
0 answers
39 views

Assistance needed with converting 2D images to 3D points using C# and Three.js

I am trying to process these 4 images for 4 cameras cube that form the outline of a cube. This is converted into an XYZ file, and I use the Three.js library to project the points from the red line ...
Julia Midori's user avatar
0 votes
0 answers
32 views

Unexpected RangeError in Three.js

I've been using Three.js to generate 3D objects in my website and I just came across this problem yesterday. I was gonna generate a PlaneGeometry with widthSegments = 1100 and heightSegments = ...
l ct's user avatar
  • 1
-1 votes
0 answers
15 views

Problems with AR start coordinates

When starting the AR session, the origin point of the world is set to the location where the quest glasses were placed, instead of the point where the session was started. I am using three libraries ...
Ruben Prieto's user avatar
0 votes
0 answers
42 views

Incorporating three.js landing page in Wordpress woocommerce site

I have a standard WordPress WooCommerce site, and I recently integrated a three.js landing page with links to the WooCommerce site. To display the animated landing page, I added the .js file and an ...
Shane Price's user avatar
0 votes
0 answers
16 views

How to render a page only through a 3D mesh using threejs

I'm trying to achieve an effect where you could see the content of a page only through a 3D object. But I have no idea where to start, what should I search to do this effect. My first idea would be to ...
Unknow's user avatar
  • 368
0 votes
0 answers
14 views

How to render .glb files with image textures in React Native (Expo)?

I am developing a React Native app using Expo and want to render .glb files with image textures. However, I'm not sure if this is supported in Expo, and I couldn't find clear documentation on this. I'...
mariusep's user avatar
1 vote
0 answers
18 views

Threejs black rendered mesh

I'm using a legacy version of threejs (r150) with a custom loader, generating meshes manually with "position" ,"normal" attributes and groups in case of different materials (...
d.mercanti's user avatar
0 votes
1 answer
33 views

how to set the fixed position and set off the auto zoom of the orbitControls in React Three Fiber?

hey i have this react three fiber model i get from sketchfab i set the orbit controls but the position of the object/models is not fixed and every time i try to scroll through my it automaticaly zoom ...
ibrahim cesar's user avatar
1 vote
0 answers
26 views

How to replicate Phong shading with a high specular highlight in WebGL using Three.js?

I'm trying to render two spheres in Three.js with custom Phong shading using GLSL shaders. I want the right sphere to have a high specular highlight, similar to the one in this reference image, where ...
peachi's user avatar
  • 21
0 votes
0 answers
28 views

Microsoft Kinect controller for a threejs character: bones not moving correctly

I am working on a project to control a character in threejs using a microsoft kinect. The data for the connect is coming in correctly, The mapping for the bones is working I guess. But when you look ...
MarioVde's user avatar
  • 147
0 votes
0 answers
13 views

Does open bim component have context menu in?

Can you tell me please. Does open bim component have context menu in? So that the context menu opens, when we pushed right button of mouse on mesh. Any help and pointers to sources appreciates. How ...
Erik's user avatar
  • 1
1 vote
1 answer
74 views

3d object should always "fit" inside the window with Orthographic Camera

I want my 3d objects to always "fit" inside the window This is how my code currently looks like export function onWindowResize(camera, renderer) { const canvas = renderer.domElement; ...
AjBernababe's user avatar
0 votes
0 answers
37 views

Applying a dynamic number of forces to particles in threejs compute shader

I've been making a particle system using threejs, based off one of the examples, and I've been trying to expand on it by adding functionality for a varying number of attractor objects, just simple ...
Christopher Body's user avatar
0 votes
1 answer
40 views

ThreeJS Add border for Text Object

Created Text with TextGeometry in Threejs, const font = await loadFont(fontUrl) const geometry = new TextGeometry("文字", { font: font, size: size, depth: 10, ...
thor lee's user avatar
1 vote
1 answer
37 views

Three Js when rotation and Scalling then mesh object psotion changes

When I object rotation or Scalling with that control then why its change's position also, See below Video https://drive.google.com/file/d/1SZ26GRon5ko8cHAG8taeeN6pP8i0xb1Z/view I want to below video ...
yash chapani's user avatar
0 votes
0 answers
23 views

How to slow down my objects when they are initialized?

I'm working with React Three Fiber (I'm a beginner in this) and when the scene is mounted and the objects appear in it, they'll are going in random directions (which is okay) but with a high velocity, ...
Nazareno Dershohannetyan's user avatar
0 votes
0 answers
16 views

R3F / ThreeJs - PlayerController distanceFactor problem

I'm using pmndrs/ecctrl for first person movement. I have placed some HTML tooltips in the scene, but the distanceFactor does not seem to work as intended. The reason is probably that the collider ...
murcoder's user avatar
-1 votes
0 answers
45 views

Matrix4 transformations applied to objects are acting awry

As stated in the title of this post, whenever I try to apply any of the below transformations to each of the cubes created in the addGUIControls() function they act in unexpected ways. When I apply ...
Zodiac's user avatar
  • 1
0 votes
0 answers
16 views

issues scaling three.js sprite texture

I am trying to scale a sprite and fill the entire screen, to have text on the top and bottom of the screen, but when I do so, it scales the text also. So how do I put a big line of text at top of ...
Sander Mez's user avatar
0 votes
0 answers
28 views

Draw on an Icosahedron faces with RenderText (three.js)

I was looking at a three.js example where the writer draws numbers on each of the faces of an icosahedron using a canvas and a Three.CanvasTexture: https://hofk.de/main/discourse.threejs/2021/...
Jon G's user avatar
  • 1,706
0 votes
1 answer
20 views

VideoTexture on a single face of model

I'm importing the very first model I made in Blender 4.2, which consists of a computer and two monitors, into my three.js scene. I have a VideoTexture map set up on the "computer screen" ...
bccode's user avatar
  • 1
0 votes
0 answers
8 views

`AnimationMixer.uncacheAction` causes exception

I'm making a webb animation with ThreeJS. I'm creating copies of an object and having them traverse down the screen. One object is created every second. When an object reaches the bottom, an event ...
Lars Melander's user avatar
0 votes
0 answers
24 views

How to set events on <PresentationControls> React three fiber drei plugin?

I have code like this - <Canvas gl={{ preserveDrawingBuffer: false, antialias: true, }} > <PresentationControls polar={[-Math.PI / ...
The Prenx's user avatar
  • 672
-3 votes
0 answers
38 views

I have some lights inside the shadows in Three js

Below is my three js code; const directionalLight = new THREE.DirectionalLight(0xffffff, 1); directionalLight.position.set(-0.6, 1, 1).normalize(); scene.add(directionalLight); const backLight = new ...
jasonzs's user avatar
  • 67
0 votes
1 answer
21 views

R3F Providing context of GLTF imported meshes causes typescript error when subscribing to and rendering meshes

So I'm rendering out instanced meshes in my scene using the code below interface IInstanceContext { [key: string]: Mesh<BufferGeometry<NormalBufferAttributes>, Material | Material[], ...
Ocean Evers-Peete's user avatar
0 votes
2 answers
50 views

Fill with a white PlaneGeometry the viewport with exact size

I am trying to paint white the viewport in threejs with a planeGeometry. The reason is that I need the view plane with size and transform (rotation and position). These are my two fails tries: ...
tres.14159's user avatar
0 votes
0 answers
22 views

How to properly fit a CanvasTexture on a mesh in Three.js?

I'm working on a project that involves applying a 2D canvas texture onto a mesh of a 3D model (specifically, projecting a canvas that imitates Windows 95 onto the screen of a computer model). My goal ...
Nassim FADILI's user avatar
0 votes
0 answers
17 views

Raycasters drifting off to far NDC

At the moment I am working with Cesium and OpenBIM Library to set up a viewer that can combine GIS and BIM information. For this approach, I need to control my BIM viewer by synchronising it with my ...
Q_Hamm_Afry's user avatar
0 votes
0 answers
39 views

How to get a realistic progress value from useProgress in React-Three-Fiber?

I'm building a 3D website using react-three-fiber and @react-three/drei. I want to display a dynamic loading bar that shows the progress of model loading using the useProgress hook from @react-three/...
Yen-Chun Lin's user avatar
2 votes
2 answers
69 views

how to import THREE.InfiniteGridHelper

When attempting to use THREE.InfiniteGridHelper there doesn't seem to be a way to import the code that doesn't generate an error. Even copying and pasting the code does not work. Currently I have the ...
person's user avatar
  • 109

1
2 3 4 5
423