Geek Answers Handbook

Material glows when zoomed (three.js r78)

Material glows when zoomed (three.js r78)

When scaling to a certain extent, the material of objects behind other objects begins to shine. It is very similar to the effect when the faces overlap (the faces are in the same plane).

To demonstrate this, I made a violin .

In this example, I draw two thin boxes (thickness 1 and the empty space between the drawers is also 1) so that the drawers do not touch each other, but the material still shines.

// geometry with thickness 1
var geometry = new THREE.BoxGeometry(20000, 20000, 1);

This screenshot shows the effect: image

This screenshot shows that there is a space between the two geometries. image

When the effect is displayed simultaneously, it sometimes appears and sometimes disappears (this also depends on the zoom distance and screen size).

, , , - , .

? WebGL? 3D-? - , ?

. - ?

+4
1

, .
OpenGL.org :

, zNear zFar , . , zNear, 0.0. zNear 0.0, . zFar , , zNear.

, 1.
.

1) near:

// camera
camera = new THREE.PerspectiveCamera(
    45, window.innerWidth / window.innerHeight, 
    500, // <-- Increased near from 1 to 500
    150000
);

2) WebGL :

// renderer
renderer = new THREE.WebGLRenderer({
    antialias: true,
    logarithmicDepthBuffer: true // <-- Set render to use logarithmic depth buffer
});


, - .

+6

More articles:


All Articles