最近在学习threejs渲染时，发现threejs可以渲染hdr文件，之前不清楚hdr这种文件是做什么的，于是查询了一番，原来是环境贴图。于是也学一下threejs如何渲染环境贴图。
效果截图
渲染动画
引入依赖
// threejs
import * as THREE fr...
2年前 (2023-07-24)
喜欢
Axios是一个基于Promise的现代HTTP客户端，用于在浏览器和Node.js中发送HTTP请求。它支持多种功能，例如拦截请求和响应、取消请求、自动转换JSON数据等。Axios插件是为了扩展Axios的功能而创建的，你可以使用插件来添加全局的请求拦截、响应拦截、错误处理等...
2年前 (2023-07-24)
喜欢
JSZip是一个JavaScript库，它允许你在浏览器中创建、读取和修改压缩文件（例如ZIP文件）。它提供了一种简单而强大的方式来处理压缩文件，让你可以在前端（客户端）进行压缩和解压缩操作，无需后端服务器的参与。
JSZip支持许多常见的压缩格式，包括ZIP、TAR、GZIP等...
2年前 (2023-07-23)
喜欢
在Three.js中，scene.background是用于设置场景（THREE.Scene）背景的属性。它定义了场景的背景颜色或者背景贴图（环境贴图），用于填充场景的可视区域。
scene.background可以接受以下几种值：
颜色值：可以使用十六进制值、RGB值或CSS...
2年前 (2023-07-23)
喜欢
EquirectangularReflectionMapping是Three.js中用于设置材质（Material）的反射映射方式之一。它用于将环境贴图（通常是Equirectangular环境贴图）应用于材质，从而实现环境反射效果。
环境贴图是一种特殊的纹理，它捕捉了场景中所有...
2年前 (2023-07-23)
喜欢
RGBELoader是Three.js中的一个实用类，用于加载高动态范围（HDR）环境贴图，它通常用于创建更逼真的光照和反射效果。HDR环境贴图以Radiance（.hdr）格式存储，能够表示更广泛的亮度范围，从而在渲染逼真场景时提供更准确的光源和反射效果。
参数和默认值：
m...
2年前 (2023-07-23)
喜欢
最近在学习hdr环境贴图渲染，但是渲染出来后的环境贴图模糊，边缘有像素块，看起来很不舒服，即便开启了antialias: true锯齿处理，仍然模糊，经过排查后发现不同的three版本渲染出来的效果是不一样的，低版本的threejs渲染出来的贴图有像素块。高版本的就没有像素块。
...
2年前 (2023-07-23)
喜欢
HDR（High Dynamic Range）格式文件是一种图像文件格式，用于存储高动态范围的图像数据。它被用于捕捉和显示比传统图像格式（如JPEG或PNG）更广泛范围的亮度和色彩信息。
传统图像格式通常使用8位（每个颜色通道有256个值）或16位（每个颜色通道有65536个值）...
2年前 (2023-07-23)
喜欢
new THREE.Euler(0, 0, 0) 是 Three.js 中创建欧拉角对象的方法，其参数为三个旋转角度（绕 x、y、z 轴的旋转角度）。这些角度用来描述物体在三维空间中的旋转姿态。
var euler = new THREE.Euler(x, y, z);
x：...
2年前 (2023-07-23)
喜欢
vue3 数据大屏项目 开发中Vue3SeamlessScroll滚动组件在与element-plus的el-tooltip使用时，会导致页面崩溃，所以这里我们需要调整一下，当鼠标移入对应的区域的时候才会切换到el-tooltip,当鼠标移开后，则恢复到最简单的p标签，这样就不会...
2年前 (2023-07-23)
喜欢
