javascript - three.js 看起来很奇怪的影子

标签 javascript three.js shadow

对 three.js 和 webgl 非常陌生,我发现带有定向光的阴影看起来很奇怪。

odd shadow

这是我的渲染器代码:

this.renderer.shadowMapEnabled = true;
this.renderer.shadowMapSoft = true;
this.renderer.shadowCameraNear = 3;
this.renderer.shadowCameraFar = this.camera.far;
this.renderer.shadowCameraFov = 75;
this.renderer.shadowMapBias = 0.0039;
this.renderer.shadowMapDarkness = 0.5;
this.renderer.shadowMapWidth = 1024;
this.renderer.shadowMapHeight = 1024;

有什么想法吗?

最佳答案

问题是你的光源对于你正在转换的物体来说太大了。您可以通过设置

light.shadowCameraVisible = true

然后尝试通过改变下面的参数 d 来减小光源的尺寸

light.shadowCameraLeft = -d
light.shadowCameraRight = d
light.shadowCameraTop = d
light.shadowCameraBottom = -d

关于javascript - three.js 看起来很奇怪的影子,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21060469/

相关文章:

javascript - 合并两个 HTML 文件

javascript - 将AsyncStorage从react-native迁移到@react-native-community/async-storage,旧保存的数据丢失

javascript - 为什么我无法让该视频在移动设备上的页面加载时自动开始播放?

javascript - THREE.MeshBasicMaterial 会渲染,但 THREE.MeshLambertMaterial 不会渲染

three.js - 如何为一个 Action 中包含所有动画的模型制作动画?

javascript - 如何使用 jQuery 的标志来交换 CSS 显示属性

objective-c - UIButton 阴影在所有 4 个面

html - CSS:删除禁用的 HTML 按钮上的阴影

cocoa - 桌面中的 NSShadow 和卷纸效果

reactjs - 使用react-三纤在 gatsby 站点中加载 gltf