![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Three.js
文章平均质量分 79
木·本
每天给自己一个希望,不为昨天而叹息,只为今天更美好
展开
-
Three.js 中的 Camera 及其视锥体坐标转换
关于 Three.js 中的 Camera 对象继承自基类 Object3D,它的另外的几个属性:.layers : Layers摄像机是一个layers的成员. 这是一个从Object3D继承而来的属性。当摄像机的视点被渲染的时候,物体必须和当前被看到的摄像机共享至少一个层。.matrixWorldInverse : Matrix4这是matrixWorld矩阵的逆矩阵。 MatrixWorld包含了相机的世界变换矩阵。.projectionMatrix : Matrix4原创 2020-10-03 22:24:15 · 2039 阅读 · 0 评论 -
Three.js 为自制的材质添加阴影
一、阴影的由来Three.js 中使用 Shadow Map 的技术来产生阴影。Shadow Map(阴影贴图)是一种使用深度纹理来为渲染阴影提供解决方案的多通道计算,用投射光源代替最终视口来观察场景。通过移动视口到光源位置,可以观察到这个位置每个东西都是明亮的,因为从光的角度来看是没有阴影的。从光源的角度将场景的深度渲染到一张深度缓冲区中,我们可以在场景中获得一张阴影或者无阴影的贴图,一张阴影贴图。因此在使用Three.js中的光源时可以设置其 shadow map 的分辨率,分辨率越高,阴影质原创 2020-08-22 20:44:46 · 1123 阅读 · 0 评论 -
Three.js - MatCap 的简单尝试
关于MatCapMatCap(Material Capture 材质捕获)是对材质的近似,对于没有UV贴图的模型非常有效。MatCap(它只是一个规则的位图)定义了每个法线方向的曲面颜色,这极大地有助于显示模型中的细节。原始的MatCap在左侧,生成的着色表面在右侧。ShaderVertex Shader顶点着色器用来将模型顶点的法向量转化为视点坐标系下的法向量,并获得该法线中的xy分量varying vec2 Point;void main(){ vec3 vNorm原创 2020-07-17 15:01:12 · 713 阅读 · 0 评论 -
Three.js + GLSL 消融效果
Codepen 源码原创 2020-05-16 13:42:50 · 756 阅读 · 7 评论 -
Cannonjs 中的 Demo 框架
上一文中提到了 Cannonjs 中的 Demo 框架,是否是必须的呢?个人觉得它不是必须的,Demo 框架本身只是方便了使用者将Cannonjs应用于Threejs。Demo 框架提供了 Scene PerspectiveCamera WebGLRenderer TrackballControls 等一些列在Threejs中所需的基本配置,同时也包括 dat.GUI 和 Stats个人认...原创 2020-04-10 12:04:18 · 847 阅读 · 0 评论