Questions tagged [react-three-drei]
275 questions
0
votes
0 answers
Optimizing react-three-fiber. Animation does not trigger instantly
The animation I'm playing with is reacting with delay. So on click the animation doesn't start right away.
My Parent component (positionsPlayer is the component of interest):
const positionsPlayer = [
new THREE.Vector3(-4, -1.5, 0.1),
…
Lukas Luke Stateczny
- 513
- 8
- 24
0
votes
0 answers
Simple react-three-flex Text example?
The @react-three/flex demos have a lot of extra stuff in them, I can't easily parse whats needed to make a simple flex-column.
Can anyone show me a barebones implementation of three-flex to make drei Text responsive? I'm trying to make a…
Ashbury
- 2,160
- 3
- 27
- 52
0
votes
0 answers
Scaling the decal after placing it on the mesh
Is there any way to size up the decal after I place it on my mesh?
After placing the decal I have the object of the decal, but the problem is that scale property is read-only.
I want to size up the decal after palcing it on the mesh, but also to…
user21347334
0
votes
1 answer
Responsive Text Drei
I have a scene with some Text components from Drei that I'd like to make responsive (smaller text size and max-width on mobile. Also since they are stacked vertically, I'm currently eyeballing the size and manually moving the text down the…
Ashbury
- 2,160
- 3
- 27
- 52
0
votes
1 answer
react-three-fiber OrbitControls camera settings don't take effect
I'm trying to render a huge model using react-three-fiber and drei's OrbitControls. The model is so huge that gets bigger that the far camera plane and gets clipped. But however I set the camera's far plane, the OrbitsControls ignores it and uses…
Gudarzi
- 486
- 3
- 7
- 22
0
votes
0 answers
CannonJS : Unknown Force is applied on some vertically stacked cubes on straight plane?
Check Video Proof Here
When three simple cubes are stacked together vertically, after some time the cube experience a force to the left direction. I checked the plane is not rotated at y or z axis. Am I missing something obvious or its just a bug in…
Pratham Vaidya
- 85
- 4
- 13
0
votes
1 answer
Click Events on Object3D (Mesh,Group, etc) in React-Three-Fiber
I want to add click event to my meshes (there are 40 meshes or groups actually). is there a way to add pointer events to the group objects like that in for loop?
object.setAttribute("onClick","console.log(hello);")
instead of adding them onClick…
Berkay Çırak
- 3
- 2
0
votes
0 answers
React XR: Problems with augmented rea
I am trying to use React XR to display some simple meshes in AR, but I am not getting the mesh to be displayed in AR.This is all the code:
import "./App.css";
import { Canvas } from "@react-three/fiber";
import React from "react";
…
Jonathan
- 11
- 2
0
votes
0 answers
I can't seem to get useTexture to load my texture what am I doing wrong?
My code is as follows
import { useRef, Suspense } from "react";
import { StyleSheet, View } from "react-native";
import { Canvas, useFrame, useLoader } from "@react-three/fiber";
import { useTexture } from "@react-three/drei";
function Earth(props)…
0
votes
1 answer
How to animate a 3D model in threejs?
I am currently working on a project to show the 3D models in frontend. When you scroll it shows the next models. I am using gsap for scrolling, and three-fiber with React framework.
You may check the working version here.
I have created functional…
Nijat Mursali
- 930
- 1
- 8
- 20
0
votes
0 answers
Performance Issue on using Water in Scene with Glass Materials
So the environment is that, I have a scene with a model of a building which has a some big windows and there is a pool in the scene also.
Now all is fine without the pool water, moving the camera using orbitControls from the drei package, no…
Brownpanda
- 78
- 1
- 9
0
votes
1 answer
Three.js drag a model on x and z axis. React three fiber
I am trying to make models draggable in three.js. I want my model to follow my mouse when I move it. This is what I am trying to accomplish. I am using react-three-fiber and @use-gesture/react
What I am trying to accomplish
Here is how my program…
LCAYSS
- 23
- 4
0
votes
0 answers
React Three Fiber ScrollControlls Infinite
I've been trying to replicate this scene from Wonderland.studio.
Here is what I have so far
Demo
However, I'm still missing a few works.
Whenever the scroll length ends camera restarts back to its starting position. Instead, I would like to have…
Ibra
- 912
- 1
- 12
- 31
0
votes
1 answer
Scaling textures on a gltfjsx import model
I'm completely new to this, and I don't know how to scale my texture to make it look smaller. it is a seamless texture. The three methods that come from materials do work well but the ones that have to do with texture don't do anything, surely it…
Ana
- 3
- 1
0
votes
0 answers
React Three Fiber Object Not Recieving Self Shadow
I am working with react three fiber in a scene. This is the relevant code
Vipul Rajan
- 494
- 1
- 5
- 16