Questions tagged [react-three-drei]
275 questions
0
votes
0 answers
How to use FlyControls in react-three-fiber?
I just changing OrbitControls to FlyControls.
However, it seems FlyControls is not working with PerspectiveCamera.
Am I missing some props for FlyControls?
function Product() {
return (

TomFan
- 113
- 9
0
votes
0 answers
How to make scrollarea in react-three/fiber?
I wanted to understand and modify this webpage: https://github.com/thedevelobear/react-three-fibear.
I created multiple files and wanted to combine them as a scrollable menu in r3f. All the effects work perfectly but I really don't know how to make…

Lalaland124
- 81
- 9
0
votes
0 answers
ERROR GET http://localhost:port/textures/matcaps/matcap-porcelain-white.jpg 404 (Not Found)
I learn ThreeJS with a vite env and @react-fiber @react-drey gsap libraries.
Dunno why but my console write several times the error:
GET http://localhost:5173/textures/matcaps/matcap-porcelain-white.jpg 404 (Not Found)
But I don't use this texture.…
0
votes
1 answer
TypeError: fetch failed when running npx gltfjsx command React Three Fiber
I'm a newbie trying to explore Three JS on react.
When I try to run gltfjsx to generate the jsx component that I will be using on my experiment game. I encountered this error, anyone has an idea ? maybe I'm doing something wrong.
I'm using node…

Random IT Guy
- 1
- 1
0
votes
0 answers
I want multiple copies of the same object on the canvas. However, when I try, only one copy of that object actually gets rendered to the screen
when calling canvas multiple time it appear once n disappear to the last canvas that I call
i dont know how to fix it
…
0
votes
0 answers
react three fiber, can't make mesh responsive to onHover events
I am trying to incorporate react three fiber events into my mesh, however it is not responsive when I do so. My project has one canvas spanning the entire webpage, and multiple objects loaded into various scenes via scissoring (i.e., the "

Hikiki Me
- 41
- 7
0
votes
1 answer
why isnt my 3d model like what is should be?
i am creating a website with react and next js. i want to display a 3d model in my website. i downloaded a file with glb format and i saw that in this website.
then i displayed the model in my website by using @react-three/fiber, @react-three/drei…

Saman
- 171
- 13
0
votes
1 answer
React Three Fiber, Drei & Intersection Observer: How to change Canvas Model Element Based on The InView Component
Would appreciate it you can help :)
even a nudge in the right direction is welcomed
Question
How do I display, based on Aside component, a different Bonsai part on scroll.
Context:
BonsaiPart changes the mesh based on a prop called partName.
I would…
0
votes
1 answer
Why am I getting this build error with three-xr of react?
I don't quite understand the error. How can I fix it or what can I do?
I have three-xr included in my react app but I get this error:
Failed to compile.
../../node_modules/@react-three/xr/src/DefaultXRControllers.tsx:8:65
Type error: Property…

redlightfilms
- 193
- 1
- 4
- 13
0
votes
1 answer
how to access image data on React-three-fiber
I would like to take image data (RGBA) from react-three-fiber
like this code on HTML
var myCanvas = document.createElement("canvas");
myCanvas.width = texture.image.width;
myCanvas.height = texture.image.height;
var myCanvasContext =…

hello
- 21
- 1
- 3
0
votes
2 answers
@react-three/drei Html element is not bubbling up the scroll event
I have a element in my react-three-fiber project. This element is grouped with the camera to keep element in front of the camera. When mouse pointer is on this element scroll i not working for ScrollControl and not scrolling. Is…

T.I
- 53
- 5
0
votes
1 answer
3D Latex Text in react-three/fiber
I am trying to write a few math equations in 3D with react-three/fiber, and have been looking for a way to get it working with latex.
Currently I have been using the Text3D component in @react-three/drei, have been googling and looking for ways to…

Abhinand Shibu
- 31
- 6
0
votes
1 answer
Blobs shader GLSL
I want to create a similar background with a shader to these images:
:
These are just blurred blobs with colors, distributed across the whole page:
Here's my current progress:…

Bart Krakowski
- 1,655
- 2
- 8
- 25
0
votes
0 answers
Adding HTML to a React Three Drei 'Instance'
I've been looking at this example here:
https://codesandbox.io/s/floating-instanced-shoes-h8o2d?file=/src/App.js
Which uses from React Three Drei..
The docs: https://github.com/pmndrs/drei#performance say that html can be…

timhc22
- 7,213
- 8
- 48
- 66
0
votes
1 answer
Blender Ocean Modifier time animation not showing in react-three/fiber
I'm creating a very simple plain in blender and applying the ocean modifier to it. After i configure the modifier and add the time keyframes, I apply the modifier and export it as .gltf . When I upload the file to an online gltfViewer the animation…

George Makroglou
- 439
- 2
- 9