Questions tagged [react-three-drei]
275 questions
0
votes
0 answers
cant apply texture to glb 3d model file three js react
i have this 3d model glb file that has a texture but its not showing for some reason. so i tried to add the texture manually but didn't work either, but my texture image appears in my network with "Status Code: 304 Not Modified" and i can see the…

Ziad Ali
- 1
- 2
0
votes
1 answer
React-tree-js MeshTransmissionMaterial randomly change opacity after motion
Hello! I am new to tree.js and am a bit lost with this bug.
After what seems to be random time interval,
The object that uses the MeshTransmissionMaterial material, changes behaviour.
Do you know where I could investigate ?
I dont expect the…

Etienne Salimbeni
- 506
- 5
- 7
0
votes
1 answer
In Three.js, how to replace geometry normal with normal map completely
How do you replace geometry normal with normal map completely? I am provided normal map and geometry from my work. I am not allowed to change these files. The goal is to just use normal map normal instead of geometry normal. However, I can't…

None None
- 27
- 1
- 7
0
votes
1 answer
Change material of cloned mesh with multiple assinged materials in React Three Fiber
Im trying to highlight cloned object when clicked.
Everything works as expected as long as each mesh in object has one material assigned. When loading FBX often fbx.material is an array. When looping and replacing within the array all cloned meshes…

tinytree
- 1,009
- 2
- 12
- 28
0
votes
0 answers
How to get 3D gltf object click event on maptiler map?
I made a react map component using maptiler docs. Then i added a 3d gltf object into the map and placed correctly. now my target is to load a custom react component when someone clicked the object, but then issue is ,i didnt get click event…

SOORAJ SR
- 17
- 7
0
votes
1 answer
Any way to make touch-control work with ScrollControls?
I'm really very bad at programming and to be honest I'm a designer.
However, I need to fix the problem so that scrolling works on touch devices as well.
https://codesandbox.io/s/diamond-rflx8p?file=/src/App.js
I tried to add touchmove, touchstart…

Funkie95
- 1
0
votes
1 answer
The scroll behaviour is behaving weird with React Three Fiber?
I have the following structure in my React Three Fiber application:
Website
Canvas
NativeHTMLContent
Canvas
Website
The problem I'm encountering is that after scrolling down the entire canvas, the scrollbar resets to the top and scrolls from top to…

Lucas Goldner
- 617
- 9
- 29
0
votes
0 answers
R3F and Drei, how to reset useProgress to its initial state on component unmount
In react I'm using the "progress" state from useProgress hook to track the loading (and show my Loading component) of my gltf object which is located on my landing page. At this stage it works perfectly fine.
The issue is that once I'm logged in and…

Simon
- 209
- 4
- 12
0
votes
1 answer
I'm trying to convert a Korean otf font to json so that I can use it as Text3D in R3F, but it's not showing up properly
Facetype.js isn't allowing me to convert Korean fonts when 'reverse font direction' is selected.
Also, if I generate the json font without that selected characters overlap, and the order is backwards.
I usually use Facetype.js to convert my fonts to…

Szabo
- 1
- 1
0
votes
0 answers
How can I achieve pointerEvent all do not affect raycaster in react-three-fiber?
The raycaster work fine when make pointerEvent to none, but I need listen to some event like click on html tag that I change its pointerEvnet to all
Then the coordinates of boxGeometry following mouse will be misaligned if using pointerEvent all
my…

Roy
- 731
- 3
- 10
- 24
0
votes
0 answers
Three.js bezier curve not scaling properly with useDrag hook in react three fibre
I'm trying to create a functionality where i can stretch a bezier curve in such a way that when the pointer moves it also scales the curve to the position of the pointer,but the issue i have now is that even though the curve stretches when i drag…

Precious112
- 53
- 4
0
votes
0 answers
Stars and 3D earth in Three.js - canvas and orbit control issue
I have been trying to get my 3D earth to work properly, every time I refresh the page it zooms in even after I set enableZoom to false.
When I add Stars into the mix, it won't allow me to adjust earth at all - zooming in or out.
I have tried…

VXBB
- 1
- 1
0
votes
2 answers
Scroll HTML at same speed as 3D objects in Fiber/Drei
I have a 3D scene that has a bunch of elements that scroll with the page. I want to add some text in front of them, but I've not found have it match the speed.
Link to scene in codeSandbox
In the codeSandbox the "hello" text initially starts out in…

Ashbury
- 2,160
- 3
- 27
- 52
0
votes
1 answer
R3F: Hooks can only be used within the Canvas component
I am trying to make a Cube with an animated "hello" text on it using threeJs (im using react).
It says "Hooks can only be used within the Canvas component!" but I even added the Canvas component in my code.
This is the code. What am I doing wrong ?…

Siddharth Juyal
- 13
- 3
0
votes
1 answer
React Three Fiber Outline only selected model from an objectArray of meshes
I'm working on a R3F project with quite a bunch of models that are accessed through an object array. I want to highlight the currently selected model through the postprocessing EffectComposer, but that seems not to work since I load my models…

Rix11
- 23
- 4