Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/three.js/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Three.js MeshDepthMaterial未按预期计算-太暗_Three.js - Fatal编程技术网

Three.js MeshDepthMaterial未按预期计算-太暗

Three.js MeshDepthMaterial未按预期计算-太暗,three.js,Three.js,我正在尝试使用Three.js的MeshDepthMaterial,但是它并不像我期望的那样工作。也许我误解了材质的工作原理,但我假设它使用相机的近距离设置和远距离设置来确定给定点处材质的“白色程度”。因此,如果我的相机位于(0,0,0),近距离为1,远距离为1000,而立方体位于(0,0,-2),我会假设立方体非常白(1-.002=99.8%白度) 然而,情况并非如此。分别使用1和10的近距离和远距离,将后立方体放置在离相机约10个单位的位置 正如您所看到的,每个立方体的材质几乎都是黑色的,尽

我正在尝试使用Three.js的MeshDepthMaterial,但是它并不像我期望的那样工作。也许我误解了材质的工作原理,但我假设它使用相机的近距离设置和远距离设置来确定给定点处材质的“白色程度”。因此,如果我的相机位于(0,0,0),近距离为1,远距离为1000,而立方体位于(0,0,-2),我会假设立方体非常白(1-.002=99.8%白度)

然而,情况并非如此。分别使用1和10的近距离和远距离,将后立方体放置在离相机约10个单位的位置

正如您所看到的,每个立方体的材质几乎都是黑色的,尽管最近的立方体更接近4个单位

,我必须非常靠近立方体才能看到强烈的白色,即使如此,立方体的远角,甚至不到1个单位的距离都是强烈的灰色

如果我将far改为1000而不是10,这些结果也保持不变

我是否误解了网状材料的工作原理?这是我的密码:

renderer: new THREE.WebGLRenderer({antailias:true, logarithmicDepthBuffer: true}),
scene: new THREE.Scene(),
camera: new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 1, 10)

....

this.renderer.setSize(window.innerWidth, window.innerHeight);
this.renderer.setClearColor(new THREE.Color(0x00000, 1.0));
this.renderer.shadowMap.enabled = true;
this.scene.overrideMaterial = new THREE.MeshDepthMaterial();

this.camera.position.z = 4;

....

this.createCube(-3, 0, -4, "#FF1215");
this.createCube(0, 0, -2);
this.createCube(2, 0, 0, "#FF7232");

其中createCube的参数是您正在使用的位置

对数深度缓冲区:true
,这会将深度函数更改为如下所示:

正如使用对数函数可以看到的那样,需要沿x轴向下走很远(或者使相机非常接近几何体),亮度才能接近1,因为它不是线性函数。根据您的描述,听起来您希望使用线性深度缓冲区,您可以通过以下设置告知渲染器使用:

对数深度缓冲区:false


或者您可以简单地从构造函数中忽略此选项,因为线性深度是默认值。

在透视投影中,深度不是线性的。看见您必须将近平面推到尽可能靠近几何体的位置,以获得“白色”对象。这是有道理的,但不幸的是,即使禁用了它,我仍然存在与此图中所示相同的问题:,设置与上面相同(1接近,1000远)。背面立方体几乎完全是黑色的,尽管距离平截头体的设置只有几个单位。除非我必须显式地设置一个参数来使用线性深度,否则我不确定还有什么可以尝试的。你可能会展示一个真实的例子,也许是通过?我不知道里面发生了什么
createCube()
。它可能是该方法内部的一些奇怪的缩放,也可能是完全其他的东西。当然,无论出于什么原因,在codepen中的结果甚至更极端(都使用r107)。实际上,我正在测试的应用程序中使用了Vue,所有的渲染代码都在这里找到:如果使用
near:1
far:1000
,可能会获得更好的效果。但是,如Rabbi76中所述,只能使用正交摄影机获得线性深度着色。如果希望使用透视摄影机进行线性着色,则需要使用自定义着色器编写自己的材质。