Questions tagged [react-three-drei]
275 questions
0
votes
0 answers
Integrating react-three-drei with React Native for 3D Graphics
I'm currently working on a project that involves creating a React Native application with some 3D graphics components. I've come across the react-three-drei library, which seems to offer a variety of useful components and utilities for working with…
Akshar Prajapati
- 1
- 1
0
votes
0 answers
boxbuffergeometry is not part of the three namespace!React problem
boxbuffergeometry is not part of the three namespace! Please help!
Even if the package is installed and tried a lot of possibilities the problem persisted.
installed the package required.
updated the package required.
checked on internet.
cleared…
0
votes
0 answers
Issue with GLB/GLTF asset staying still on canvas and just rotating around y-axis, it jumps around with scrolling and I want to make the asset small
Issue with GLB/GLTF asset staying still on canvas and just rotating around y-axis, it jumps around with scrolling and I want to make the asset small with respect to the size of the page because when the asset is rotating automatically around the…
Daniel Mironiuk
- 21
- 2
0
votes
0 answers
Lights Not Producing Expected Effects on 3D Model in Three.js
I'm currently working on a 3D scene using Three.js, where I've incorporated a 3D model using the @react-three/fiber and @react-three/drei libraries. The model renders correctly, but I'm encountering issues with getting the lights to produce the…
0
votes
0 answers
Trouble controlling rigged robotic arm model with sliders in React Three Fiber
I am currently working on a project where I'm trying to control a rigged robotic arm model using sliders in React Three Fiber. The goal is to manipulate the arm's bones, specifically rotating them on the X-axis. However, I've encountered a problem…
codesmith
- 1
- 1
0
votes
1 answer
Drawing Line components in three react fiber not appearing in correct grid pattern based on Canvas size
I'm going to be setting up a flow field in my React app using three-react-fiber (r3f) but before I do that I am using the Line component from the drei library to draw the grid so I can visualize the flow field. The issue that I'm having is trying to…
Alex Kahn
- 1
- 1
0
votes
0 answers
3D model rotation in react three fiber
I'm new here and have question related to 3D model rotation in react three fiber.
here is the link for codesend: https://codesandbox.io/p/sandbox/cool-bogdan-y5c2ny
if someone knows how to rotate the model I will be very thankful. if there is too…
0
votes
0 answers
Generating a less resource demanding three js plane wireframe
i have been able to generate this type of grid with react + threejs. But it is very resource heavy when i add more models, and i suspect it is due to the way i have generated this grid.
The wanted grid
This is the following code. Any ideas?
import {…
macshakeit
- 1
- 1
0
votes
0 answers
Blank screen coming while rendering 3d object using threejs | component from @react-three/fiber is throwing error related to a failed GLTF buffer load
I was following a tutorial from YouTube on Three.JS portfolio from JS Mastery but the blank screen is not going even if I copy the code from git please help
import React, { Suspense, useEffect, useState } from "react";
import { Canvas } from…
ded inside girl
- 1
- 1
0
votes
1 answer
Loading .obj with React and Three.js
I'm attempting to import a .obj file into react to pass around and show in a viewport. I have created a viewport component that works when using included primitivies. However, I'm not sure how to import an obj. I'm using vite.
import React, {…
Etch-a-sketch
- 37
- 1
- 6
0
votes
1 answer
How to animate a camera after getting a JSON file from @theatre/core with react three fiber?
After removing the studio from main.jsx the camera stops at the first frame.
The only way i got it to move is using scroll but i want the animation to start when first getting in the website and stopping.
here's App.jsx:
import { Canvas,…
Ziad Kaddari
- 3
- 1
0
votes
0 answers
Issues with Animation Mixer in Three js. Animations don't seem to play whenever i initialize the animation mixer only once
I am trying a load a model and animation using GLTF Loader, both model and animation are in separate file. The model basically has to categories of animations 1 is idle and other is talking.
So when i intialize the Animation mixer only once when the…
Rahul
- 1
- 1
0
votes
2 answers
Uncaught Error: Could not load ./desktop_pc/scene.gltf: THREE.GLTFLoader: Failed to load buffer "scene.bin"" Been trying to solve this
I have tried using (glb) format as it was said in other post but it didn't help and some other fixes but to no use. I was trying to render this scene and whenever I try the browser(I mean internet download manager) just grabs the "scene.bin" as a…
Dawood Haider
- 11
- 2
0
votes
0 answers
How to use right mouse click events in use-gesture/react
When I use bind function from the react-use-gesture on a mesh, then the mouse down events on the mesh are overridden by the bind event. And usegesture is only taking only left click events.
I tried adding mousedown events on mesh but it didn't work
jsc
- 1
- 1
0
votes
0 answers
How to dynamically render 3D models using three js
I'm interested in creating a website where users can upload 3D models of products. Although I'm new to Three.js and 3D modeling, I plan to use Express for the backend API and React for the frontend.
I've been following various tutorials, but most of…
