繁体   English   中英

Three.js-网格表面上的极端阴影

[英]Three.js - Extreme shadow on face of mesh

我已经使用Blender创建了一个胸部模型,为其创建了手绘纹理,并在用Three.js渲染的环境中设置了整个东西。 但是,胸部正面有一个异常的极端阴影:

在此处输入图片说明

这是我的渲染器设置:

var renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);
return renderer;

这是造成此阴影的光源(在屏幕截图中,它是唯一的光源):

var envLight = new THREE.PointLight(color, 0.5, 320);
envLight.position.set(0, 80, zPos);
return envLight;

材料设置:

var material = new THREE.MeshPhongMaterial();
//diffuse texture setup
material.map = THREE.ImageUtils.loadTexture(textureURL);
material.map.wrapS = material.map.wrapT = THREE.RepeatWrapping;
material.map.repeat.set(repeatX, repeatY);
// specular map setup
material.specularMap = THREE.ImageUtils.loadTexture(specularMapURL);
material.specularMap.wrapS = material.specularMap.wrapT = THREE.RepeatWrapping;
material.specularMap.repeat.set(repeatX, repeatY);
material.specular = that.specularLightingColor;
return material;

使用此材料以及包含从Blender导出的几何图形和UV映射的JSON数据创建网格。 我使用THREE.JSONLoader在运行时获取数据。 这是一个来自Blender的屏幕截图,显示了网格和UV贴图的展开状态,这与所选面的形状和怪异阴影的确切位置相匹配似乎是一个问题。

在此处输入图片说明

我尝试使用Object3D的castShadow / receiveShadow属性禁用阴影,但这根本没有显示任何效果。

网格法线方向的另一个屏幕截图 在此处输入链接说明
(来源: front-a-little.de

我已经更新到最新的three.js版本(r70),并更新了完全重写的Blender Export插件。 所描述的问题很可能是该导出器先前版本中的一个错误,使用新插件的导出模型不会显示出怪异的阴影。

固定版

新的导出器在保存屏幕中具有新设置,我必须确保选中“材料”下的“ UVs”框,以便通过Three.JSONLoader加载模型。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM