Questions tagged [three.js]
Three.js is a JavaScript 3D Library which makes use of WebGL
33
questions with no upvoted or accepted answers
2
votes
0
answers
493
views
THREE.ShaderMaterial cannot perform antialiasing
I created a ShaderMaterial to draw a box in three.js using the following key code:
...
2
votes
0
answers
341
views
Clipping drawn mesh by arbitrary volume
I'm trying to create a visual effect where an arbitrary part of the main scene is either clipped out by or cropped to an arbitrary volume. That is to say, I might want to draw just the area of the ...
2
votes
0
answers
732
views
My collision detection is not working when I rotate my mesh in three.js
I am trying to move a ball mesh through a maze. The maze belongs to a parent object3d. My issue is that when I move the ball I can't detect collision right well because in the rotation, the axis ...
1
vote
0
answers
393
views
Aircraft simulation
Trying to get a "semi" realistic aircraft simulator. I'm pulling my hair out because I just can't get the math right. I'm not looking for super realistic but want to at least get some ...
1
vote
0
answers
99
views
Calculate 2d rotation to target (uniformly accelerated rotation, constant speed)
I'm trying to calculate an uniformly accelerated rotation for the autopilot module in my 3d space game shooter. The autopilot should fly the spaceship to any given point in the 3d space on the ...
1
vote
0
answers
173
views
Z-Fighting mitigation performance overhead
Which of following approaches will have less performance overhead(using threejs renderer)?
I am currently have an issue with z-fight for distant objects, while my near/far plane is already set to most ...
1
vote
0
answers
333
views
How can I use canon.js in three.js editor?
I would like to add bullet physics to a scene crated by the three.js editor. Where do I need to put the canon.js file in order to be able to access it's functions from the editor scripts?
I ...
1
vote
0
answers
52
views
How to load models with possibility to change textures in Three.js
I'm working on a game in Three.js where I have a few variations of the same model in blender.
What I want to achieve is that I'll load the model once with all the material settings, but then I'll ...
1
vote
0
answers
2k
views
How to make an object which position is not on the world origin rotate around the world orgin in threejs?
I've loaded an object and set its position on vector(5,2,-5) by threejs. And I wanted it to rotate around the origin point in the world coodinate system. I found a method in class Object3D called '...
1
vote
0
answers
431
views
Texture mapping artifacts at triangle edge (for thin triangles?)
I'm working on generating programmatic textures for 3d models and showing them in WebGL using Threejs. To do this I generate a texture image (PNG) that contains per-triangle textures (a rectangle on ...
1
vote
0
answers
64
views
align local Y to be parallel with global Y during or after slerp
I am using the following function to have a globe rotate a point on its surface to face the global Z toward the camera. This works fine, but after each rotation the Y axis seen as a green line is not ...
1
vote
0
answers
48
views
How to use quaternion on another referential
I'm new on Three.js and despite a mechanical background, I can't find how quaternion works: it's like it always refers on local part referential and not the global one.
I've illustrated it here : ...
1
vote
0
answers
62
views
Unstable behavior when applying impulse
I created a video that describes the problem since it very hard to explain it. Basically, using physi.js, I am applying random impulse on the object. In the video, at 0:17 the problem begins when the ...
1
vote
0
answers
43
views
My Directional light lights the floor of my cave but not the ceiling (concave mesh)
I am developing a small demo with Meshes created from a vertex map.
When i put a hole in the mesh (making it concave) the physics work fine but the directional lightning only lights one part of the ...
1
vote
0
answers
1k
views
Must light helper be added directly in scene?
Following method of adding light helper works ok:
...
1
vote
0
answers
254
views
Is there an out-of-the-box way to create a custom non-convex polygon in three.js?
Does Three.js offer an out-of-the-box way to create custom non-convex polygon, or do I have to use THREE.Geometry and set faces manually? I'm guessing that ...
0
votes
0
answers
35
views
Shadow squares on meshes
I had created project on r3f (React THREE Fiber), and after "blocking" when I decided to add high resolution models, I noticed this shadow issue.
Help me to understand, how can I fix the ...
0
votes
1
answer
78
views
Discontinuous Normals on a Normalized Cube Mesh with Displacement Texture
In my project, I have created a normalized cube using six plane meshes. To improve its visual quality, I added a displacement texture and calculated the normals for that texture to ensure proper ...
0
votes
0
answers
206
views
three.js shader to keep moving vertices of points cloud inside sphere
I am trying to achieve the effect of having a points cloud with moving points while also keeping them confined within a sphere of radius X.
I have managed to do it without using shaders but I want to ...
0
votes
0
answers
87
views
Octree build time crashes page for complex mesh
Using the standard three.js FPS example of octree implementation with a more advanced mesh, crashes the page on load.
My first idea is to write a few functions to save the octee data to a file, then ...
0
votes
1
answer
174
views
Multiplayer game - Player position updates transmission pattern
I'm building a very basic 3D multiplayer game using Three.js and Socket.io where all the player does is move in an environment.
Considering there will be ~ 100 players in a single room and all data ...
0
votes
1
answer
134
views
Creating a Game in Three.js do i share camera, scene objects?
Im creating a game with React and Three.js and vanilla Javascript, i have several clases, representing objects in the game, do i need to create a camera, scene, renderer for each class or i simply ...
0
votes
0
answers
113
views
Three.js Animate Text error geometry.faces
In this three.js Text example they animate text, i am trying to implement it on React/Three.js but i got the error TypeError: can't access property "length", geometry.faces is undefined
in ...
0
votes
0
answers
178
views
How to calculate local orientation of child relative to parent from only global positions?
I am trying visualize a human finger's pose with a 3D model in Three.js.
The 3D model is composed of 3 bones that represent the proximal, middle, and distal bones of the human finger, connected in ...
0
votes
1
answer
564
views
Shade a box different colors for two ends with one material in Three.js
First, I knew the following basic knowledges,
GLSL Language, Learn WebGL2 - GLSL
* GLSL Shaders
OpenGL - Coordinate Systems, [OpenGL - Advanced GLSL]
3D Game Shaders For Beginners - GLSL
...
0
votes
1
answer
519
views
What is the best rate at which to send updates to clients for a first person shooter NodeJS WebSocket server?
I developed a multiplayer FPS using WebGL, Nodejs and WebSockets.
So far it is running great.
I am currently using setInterval(sendPlayerPositions, 16); to send updates to WebGL clients.
Ideally I ...
0
votes
0
answers
674
views
Three js raycaster WITHOUT camera
I seem to find only examples to use the raycaster with the camera, but none that just have a raycaster from Point A to Point B.
I have a working raycaster, it retrieves my Helpers, Lines etc. but it ...
0
votes
0
answers
886
views
OpenGL seamless repeated texture has artifacts on edges
I'm currently trying to map a seamless texture onto a 3d wall object but when it comes to the edges of the texture there are visible artifacts.
closeup:
Here is the shader code i use for the texture ...
0
votes
0
answers
211
views
How to position a 3D crosshair on an objects face and set its angles **outward** from objects face?
What I have right now, is a ray tracer for my cursor on my canvas, when I click on the object, it gets the vector of my selection in the 3D space on the object I had my mouse on.
The ray tracer ...
0
votes
0
answers
455
views
parametric 3D sphere unwrapping math for perfect 3D-textures
After some time looking or it on the internet I can't find the proper answer to my concern.
I'm currently generating 3D textures on a shader for my planets to avoid sphere mapping issues (pole, ...
0
votes
1
answer
310
views
How to add a JSON object / model into your whitestorm world / scene?
I am loading the object from my json file.
...
0
votes
1
answer
859
views
Shader to render objects with distance independent size
I am trying to find a way to render certain objects in my 3d scene without the effects of the perspective projection. E.g. I want them to have the same pixel dimension independent of distance to the ...
0
votes
1
answer
2k
views
How can you merge the geometries of cloned objects in Three.JS?
So I'm testing the best non-voxel way to display a lot of objects at once and so I found how to merge geometries.
Now, I can easily merge most geometries, but I can't seem to merge the geometries of ...