Questions tagged [three.js]
Three.js is a lightweight cross-browser JavaScript library/API used to create and display animated 3D computer graphics on a Web browser. Three.js scripts may be used in conjunction with the HTML5 canvas element, SVG or WebGL.
three.js
21,176
questions
0
votes
0
answers
8
views
Raycasting and Hover Effect
Hello to everyone who's reading!
I'm building a website in THREE.js where you can scroll through "cards" that are seen isometrically, and I'm currently adding an animation when hovering each ...
- 3
0
votes
0
answers
10
views
ThreeJs codepen to React component
I've been trying to move this codepen.io to a react component, this what I did:
React Custom Hook
import { useEffect, useRef } from 'react';
import * as THREE from 'three';
import { createNoise4D } ...
0
votes
0
answers
24
views
How to apply a minecraft skin texture to my model and add the outer layer to the model?
I want to add minecraft skin model to my website using three.js:
I'm using next.js, so to interact with three.js I use @react-three/fiber and @react-three/drei.
I just started learning three.js and ...
- 27
0
votes
0
answers
15
views
What is the proper way to Mirror a SkinnedMesh in three.js?
I'm loading a glTF model of a right hand, and then loading it again (later I'll just clone the already-loaded one) and attempting to flip it in order to create a left hand.
I know a mesh/Object3D can ...
- 1,232
0
votes
0
answers
14
views
error with the path to import GLTF loader on threeJs
I had a problem who persist with a test project with three js...
i made my 3d models on blender anbd export him to .glb format and now try to imoport it to my scene with GLTF Loader but always the ...
0
votes
1
answer
20
views
Fetch Textures From a Collection
Hello everyone who's reading.
I'm trying to create a website where I can mouse scroll through "cards" that are all in a single line, seen with a iso view from the side.
I've set up the scene ...
- 3
1
vote
0
answers
31
views
How to Change the Initial Perspective of CameraControls?
I've written a React component where I'm trying to change the initial perspective of CameraControls, but I haven't been successful. Does anyone have any ideas?
The code to change the position of the ...
- 100
0
votes
1
answer
19
views
How can I display a GLTF File using Qwik and Three Js?
I have this current code setup in the qwik js framework to display a gltf file inside of my website using three js, but for whatever reason it simply doesn't display it. There are no error logs or ...
- 117
0
votes
0
answers
19
views
How to apply a shader texture to a GLB model element while preserving the native GLB texture?
I have a GLB model and I want to apply a shader texture to it in three.js
But I want to preserve the texture of the model that was created in Blender
Unfortunately, the shader completely overwrites ...
0
votes
0
answers
17
views
ThreeJS hitbox manipulation
Very new here, apologies if this is super basic.
I have a sphere. I want to:
Be able to create zones on the mesh. So at a start there will be one zone completely around the mesh. This is essentially ...
0
votes
1
answer
15
views
Cannot find module 'three/examples/jsm/controls/OrbitControls' or its corresponding type declarations
I'm using TypeScript and three.js in my React project, and I'm importing OrbitControls like so:
import * as THREE from "three";
import { OrbitControls } from "three/examples/jsm/...
- 2,415
0
votes
0
answers
14
views
How to access the ar.js camera feed in order to take a snapshot?
I'm trying to take a snapshot of the camera feed in order to scan QR codes in my application.
I've tried to inspect the data using the code below, but I can't find a way to access the media stream.
...
- 21
0
votes
0
answers
15
views
Three.js: How to prevent flickering, which occurs when page restarts. (White flashing)
On my discover flickering occurs when page “off”. Effect act during 1-2ms in canvas. Moreover this problem may occur or not occur in any canvas blocks on page.
I tested more variants of solution this ...
- 1
0
votes
0
answers
27
views
Camera Positioning Issue: Integrating Three.js MapControls with GSAP Animation for Precise Target Locations
I’m encountering a problem while animating my 3D model using GSAP and Three.js. Specifically, the issue occurs when I pan the model - the camera doesn’t move to the intended target position correctly.
...
0
votes
0
answers
43
views
How to make completely white floor with shadows?
Please help. I want white floor and shadows on it, but all I get is lightgray floor with very thin shadow:
lightgray floor
My floor and light configuration:
const ModelSceneEnvironment = () => {
...
