THREE.js - 带有导入模型的图形故障 [英] THREE.js - Graphical Glitch with an imported model

问题描述

我在使用 JSONLoader 时遇到了导入模型的图形故障.我无法真正解释它，你必须看到它.
它可能与不同的材料和相机 POV 有关.

你可以在这里找到 plunk:
http://plnkr.co/edit/0VjHiGNmWFHxdoMWC3GV?p=info

JSONLoader 部分代码:

var loader = new THREE.JSONLoader();loader.load('tv.js',功能(几何，材料){var tv = new THREE.Mesh(geometry, new THREE.MeshFaceMaterial(materials));glScene.add(tv);});

故障截图

解决方案

您所指的故障"是由于 z-fighting.

您的相机近平面为 0.01，远平面为 20000.近平面的小值会导致深度排序精度问题.

在您的情况下，将您的近平面设置为 1 或 10.

参考:http://www.opengl.org/wiki/Depth_Buffer_Precision.>

three.js r.81

I'm experiencing a graphical glitch with an imported model while using JSONLoader. I can't really explain it, you'll have to see it.
It may have something to do with the different materials and the camera POV.

You can find the plunk here:
http://plnkr.co/edit/0VjHiGNmWFHxdoMWC3GV?p=info

JSONLoader part of the code:

var loader = new THREE.JSONLoader();
loader.load( 'tv.js',
        function ( geometry, materials ) {
        var tv = new THREE.Mesh( geometry, new THREE.MeshFaceMaterial(materials) );
        glScene.add(tv);
} );

a screenshot of the glitch

解决方案

The "glitch" you are referring to is due to z-fighting.

Your camera near plane is 0.01 and far plane is 20000. Small values of the near plane can lead to depth-sorting precision problems.

In your case, set your near plane to, 1 or 10.

ref: http://www.opengl.org/wiki/Depth_Buffer_Precision.

three.js r.81

这篇关于THREE.js - 带有导入模型的图形故障的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！