网站建设环境配置,有关做生态环境的官方网站,运城做网站方式方法,工商核名在哪个网站这篇主要用来记录我学习3d渲染相关的疑问记录,后续会持续的更新,如果我的理解不对欢迎评论区更正。
目录
1.WebGLRenderer和WebGPURenderer的区别
1.1 WebGLRenderer
1.2 WebGPURenderer
二、scene.background和renderer.setClearColor有什么区别
三、renderer.setAnimat…这篇主要用来记录我学习3d渲染相关的疑问记录,后续会持续的更新,如果我的理解不对欢迎评论区更正。
目录
1.WebGLRenderer和WebGPURenderer的区别
1.1 WebGLRenderer
1.2 WebGPURenderer
二、scene.background和renderer.setClearColor有什么区别
三、renderer.setAnimationLoop和requestAnimationFrame的区别
四、renderer.toneMapping的属性区别和使用场景
1.WebGLRenderer和WebGPURenderer的区别
1.1 WebGLRenderer
文档地址:three.js docs
基于WebGL,使用 WebGL API广泛支持各种浏览器。成熟稳定具有广泛的兼容性和社区支持。性能虽然性能不错但在处理复杂场景或高多边形数时可能会有瓶颈使用纹理压缩、实例化等技术优化性能。着色器使用 GLSL 着色器。适用于需要广泛兼容性的项目
const renderer new THREE.WebGLRenderer();
1.2 WebGPURenderer
官方文档地址WebGPU
基于WebGPU,使用WebGPU API更现代的图形API浏览器支持有限。着色器使用 WGSL 或 SPIR-V 着色器语言可能需要额外配置。性能更高效的资源管理、更低的 CPU 开销。旨在提供更高的性能和更低的延迟特别是复杂场景和计算偏向用于性能要求高的场景中。
const renderer new THREE.WebGPURenderer();
二、scene.background和renderer.setClearColor有什么区别
共同点都可以设置背景颜色。
不同点
作用范围background只能影响特定的场景背景setClearColor设置渲染器清除颜色影响所有场景支持类型background可以设置颜色、纹理setClearColor只能设置颜色。
三、renderer.setAnimationLoop和requestAnimationFrame的区别
共同点两个都用于创建动画循环。
不同点
renderer.setAnimationLoop可以自动处理虚拟现实VR和增强现实(AR)渲染简化了动画循环的管理对于WebXR项目必须使用此函数。requestAnimationFrame是原生js方法需要手动调用渲染逻辑。
用法如下
// setAnimationLoop的用法
renderer new WebGPURenderer({ antialias: true });
renderer.setAnimationLoop(() {renderer.render(scene, camera);}); // 如果是WebXR必须使用这个// requestAnimationFrame的用法
function animate() {requestAnimationFrame(animate);// 渲染逻辑renderer.render(scene, camera);
}
animate();
四、renderer.toneMapping的属性区别和使用场景
THREE.NoToneMapping 描述不进行色调映射使用场景场景不需要任何色调调整THREE.LinearToneMapping 描述线性映射不做特殊处理。使用场景简单场景通常用于调试。THREE.ReinhardToneMapping: 描述逐渐压缩高亮部分保持细节使用场景游戏和实时渲染需要平衡高亮和细节。THREE.CineonToneMapping: 描述模拟胶片的色调映射使用场景电影渲染追求胶片效果。THREE.ACESFilmicToneMapping 描述高质量色调映射模拟电影胶片的宽动态范围。使用场景高动态范围HDR场景追求真实感和高质量视觉效果。THREE.AgXToneMapping: 描述过度暴露的区域提供了更好的颜色处理。尤其是明亮部偏于白色更接近真实相机。使用场景适用于需要表现真实光照效果的场景比如摄影模拟、游戏中的环境光照效果细致表现光线变化和阴影的应用场景如建筑可视化。THREE.NeutralToneMapping 描述旨在提供一种中性平衡色调映射方式保持图像的自然色彩和亮度。使用场景这种方法提供了一种较为简单的转换方式能够在不显著改变图像原始色彩的情况下适当降低亮度。THREE.CustomToneMapping 描述允许开发者自定义色调映射的方法。