Three.js进阶教程-玩转Web3D,视频+资料全套(12.6G)

4
回复
57
查看
  [复制链接]
字体大小: 正常 放大

6993

主题

6990

帖子

2万

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
21280
发表于 2020-4-18 11:42:15 | 显示全部楼层 |阅读模式

aa54b79323fddab-600x171.jpg
课程文件目录:
目录:/V-1335:Three.js进阶教程
第1章 学习必看
0 Three.js中文文档 .mp4
第2章 数学Math
02 向量.mp4
03 矩阵.mp4
04 旋转、平移和缩放矩阵.mp4
05 投影矩阵、视图矩阵.mp4
06 包围盒Box3、Box2、Sphere.mp4
07 欧拉Euler和四元数Quaternion.mp4
08 几何计算Line3、Triangle、Ray、Plane.mp4
第3章 Threejs系统原理
09 场景、相机和渲染器.mp4
10 WebGL渲染器简介.mp4
11 renderers目录下渲染器相关代码块介绍-1.mp4
11 renderers目录下渲染器相关代码块介绍-2.mp4
12 顶点数据封装.mp4
13 解析几何体提取顶点数据.mp4
14 层级模型封装和解析.mp4
15 本地矩阵和世界矩阵.mp4
16 对象具体分类过程.mp4
17 点线网格模型和绘制模式.mp4
18 光源对象分类.mp4
19 Material对应的Shader.mp4
20 处理shader代码.mp4
21 着色器字符串处理—材质属性、光源数量.mp4
22 火狐查看Three.js合成的着色器shader.mp4
23 传值-attribute.mp4
24 uniform变量传值.mp4
25 着色器材质对象ShaderMaterial.mp4
第4章 Threejs自定义着色器
26 第一个three.js着色器程序.mp4
27 着色器——矩阵变换.mp4
28 着色器——Uniform.mp4
29 光照计算.mp4
30 颜色插值计算.mp4
31 纹理贴图.mp4
32 彩色图处理为灰度图.mp4
33 UV动画.mp4
34 着色器模块.glsl调用.mp4
35 系统uniforms模块调用UniformsLib.mp4
36 模仿系统的材质对象.mp4
37 自动提取光源对象信息.mp4
38 phong网格材质二次开发.mp4
39 WebGLRenderTarget(离屏渲染).mp4
40 WebGLRenderTarget实现灰度图后处理功能.mp4
41 后处理EffectComposer—自定义着色器.mp4
42 后处理EffectComposer——直接调用常见通道.mp4
资料
Three.js数学相关内容
1.向量
案例源码
顶点位置、UV、法向量
1.Geometry创建三角面设置UV坐标.html
Earth.png
.cross ()叉乘——任意几何体表面积计算.html
.dot()方法——计算三角形夹角余弦值.html
控制台查看向量对象数据结构.html
两点之间距离计算.html
知识点.html
Vector2.js
Vector3.js
Vector4.js
2.矩阵
0.了解矩阵对象.html
知识点.html
Matrix3.js
Matrix4.js
3.旋转、平移和缩放矩阵
0.变换矩阵.html
知识点.html
4.投影矩阵、视图矩阵
6.1正投影和透视投影相机
0.正投影相机.html
1.透视投影相机.html
lookat镜头来回晃动.html
lookat起作用.html
知识点.html
Camera.js
Object3D.js
OrthographicCamera.js
PerspectiveCamera.js
5.包围盒Box3、Box2、Sphere
案例源码
加载一个外部模型显示包围盒
0.可视化展示包围盒.html
1.考虑层级模型坐标.html
2.包围球情况.html
group.json
.setFromPoints().html
0.几何体居中.html
知识点.html
Box2.js
Box3.js
Geometry.js
Sphere.js
6.欧拉Euler和四元数Quaternion
0.测试.html
知识点.html
Euler.js
Object3D.js
Quaternion.js
7.几何计算Line3、Triangle、Ray、Plane
0.测试.html
知识点.html
Line3.js
Plane.js
Ray.js
Triangle.js
Three.js系统原理
1.场景、相机和渲染器
原生WebGL代码.html
知识点.html
threejs渲染一个3D场景.html
2.WebGL渲染器简介
源码案例
15.1-场景渲染结果网页局部显示
0.全屏渲染.html
1.插入局部div元素中.html
缓冲区相关
0.两帧叠加.html
1.清除深度缓冲区数据.html
渲染管线.png
知识点.html
3.renderers目录下渲染器相关代码块介绍
知识点.html
4.顶点数据封装
2、顶点概念、几何体结构
1.顶点位置数据解析渲染
顶点位置数据解析渲染.html
2.顶点颜色数据插值计算
0.每个顶点显示一种颜色.html
1.彩色线条.html
2.彩色三角面.html
3.顶点法向量数据光照计算
顶点法向量光照计算.html
4.顶点索引复用顶点数据
0.矩形非索引绘制.html
1.矩形索引绘制.html
5.设置Geometry顶点位置、顶点颜色数据
0.Vector3定义顶点数据.html
1.定义顶点颜色数据.html
6.Face3对象定义Geometry的三角面
0.设置Face3顶点索引、法向量.html
1Face3颜色和geometry的colors属性.html
7.访问几何体对象的数据
0.访问几何体对象的数据.html
1.设置立方体顶点颜色.html
2.删除立方体一个面.html
8.旋转平移缩放变换、复制、克隆
0.几何体旋转、平移、缩放变换.html
0.测试.html
1.原生WebGL代码.html
2.顶点索引绘制绘制线框立方体.html
知识点.html
BufferAttribute.js
BufferGeometry.js
Geometry.js
5.解析几何体提取顶点数据
示意图
几何体.png
解析规则.png
Threejs解析流程图.png
Geometry转化为BufferGeometry
5.设置Geometry顶点位置、顶点颜色数据
0.Vector3定义顶点数据.html
1.定义顶点颜色数据.html
6.Face3对象定义Geometry的三角面
0.设置Face3顶点索引、法向量.html
1Face3颜色和geometry的colors属性.html
BufferGeometry.js
DirectGeometry.js
JavaScript语法
测试.html
WeakMap.html
原生webgl代码.html
知识点.html
WebGLAttributes.js
WebGLGeometries.js
WebGLObjects.js
WebGLRenderer.js
6.层级模型封装和解析
6、层级模型、树结构
1.组对象Group、层级模型
组对象Group、层级模型.html
2.对象节点命名、查找、遍历
对象节点命名、查找、遍历.html
递归算法
0.html
层级模型.jpg
知识点.html
Object3D.js
WebGLRenderer.js
7.本地矩阵和世界矩阵
6.3本地位置坐标、世界位置坐标
本地位置坐标、世界位置坐标.html
本地矩阵和世界矩阵.jpg
知识点.html
Matrix4.js
Object3D.js
8.对象具体分类过程
示意图
对象分类.png
渲染器渲染函数.png
Threejs解析流程图.png
知识点.html
WebGLRenderLists.js
WebGLRenderStates.js
9.点线网格模型和绘制模式
点线网格模型对象
0.html
Line.js
LineLoop.js
LineSegments.js
Mesh.js
Points.js
SkinnedMesh.js
原生WebGL
0.绘制一个点.html
1.绘制一个线框立方体.html
2.立方体(每个面一种颜色).html
顶点索引绘制线框立方体.html
模型对应绘制模式.png
知识点.html
WebGLBufferRenderer.js
WebGLIndexedBufferRenderer.js
10.光源对象分类
光源对象封装
lights
AmbientLight.js
DirectionalLight.js
DirectionalLightShadow.js
HemisphereLight.js
Light.js
LightShadow.js
PointLight.js
RectAreaLight.js
SpotLight.js
SpotLightShadow.js
0.html
光源对象分类.png
知识点.html
WebGLLights.js
WebGLRenderStates.js
11.Material对应的Shader
材质对象封装
materials
LineBasicMaterial.js
LineDashedMaterial.js
Material.js
Materials.js
MeshBasicMaterial.js
MeshDepthMaterial.js
MeshDistanceMaterial.js
MeshLambertMaterial.js
MeshNormalMaterial.js
MeshPhongMaterial.js
MeshPhysicalMaterial.js
MeshStandardMaterial.js
MeshToonMaterial.js
PointsMaterial.js
RawShaderMaterial.js
ShaderMaterial.js
ShadowMaterial.js
SpriteMaterial.js
0.JavaScript语法.html
知识点.html
Material与shader.jpg
WebGLPrograms.js
12.处理shader代码
原生WebGL代码.html
着色器处理流程.jpg
知识点.html
WebGLProgram.js
WebGLPrograms.js
WebGLShader.js
13.着色器字符串处理—材质属性、光源数量
着色器字符串处理.png
知识点.html
14.火狐查看Three.js合成的着色器shader
处理后顶点shader.glsl
处理后片元shader.glsl
meshphong_frag.glsl
meshphong_vert.glsl
threejs程序.html
15.传值-attribute
原生WebGL代码.html
知识点.html
BufferGeometry与attribute变量名.png
gl.getProgramParameter.html
WebGLProgram.js
16.uniform变量传值
原生WebGL
0.原生WebGL代码.html
1.批量获得uniform变量索引地址.html
2.结构体uniform变量传值.html
3.获得结构体的索引地址.html
4.uniform数组变量.html
5.数组+结构体.html
知识点.html
lights_fragment_begin.glsl
lights_pars_begin.glsl
map_pars_fragment.glsl
normalmap_pars_fragment.glsl
WebGLUniforms.js
17.着色器材质对象ShaderMaterial
知识点.html
Three.js着色器教程
1.第一个three.js着色器程序
0.WebGL.html
1.ShaderMaterial.html
2.线条绘制模式.html
3.三角形绘制模式.html
4.RawShaderMaterial.html
知识点.html
2.着色器——矩阵变换
0.不进行矩阵变换.html
1.模型变换.html
2.相机视图、投影变换.html
知识点.html
3.着色器——Uniform
0.自定义color变量.html
1.定义一个变换矩阵.html
知识点.html
4.着色器——光照计算
0.无光照计算.html
1.自定义光照uniform.html
2.RawShaderMaterial.html
知识点.html
5.着色器——颜色插值计算
0.着色器——顶点颜色插值计算.html
知识点.html
6.着色器——纹理贴图
0.纹理贴图.html
知识点.html
Earth.png
7.着色器——彩色图处理为灰度图
0.彩色图处理为灰度图.html
Earth.png
panda.png
8.着色器——UV动画
0.着色器——太阳纹理贴图.html
1.着色器——UV动画.html
2.纹理对象offset属性.html
大气.png
知识点.html
Earth.png
EarthNormal.png
EarthSpec.png
9.着色器——着色器模块.glsl调用
1.顶点矩阵变换着色器块project_vertex.glsl的调用
0.顶点投影、视图、模型矩阵变换.html
1.project_vertex.glsl的调用.html
begin_vertex.glsl
project_vertex.glsl
2.颜色贴图模块着色器代码调用
0.纹理贴图.html
1.调用map_pars_fragment.html
2.调用map_pars_fragment.html
Earth.png
map_pars_fragment.glsl
uv_pars_fragment.glsl
知识点.html
10.着色器——系统uniforms模块调用UniformsLib
0.uniforms设置.html
1.UniformsLib.html
知识点.html
Earth.png
UniformsLib.js
UniformsUtils.js
11.着色器——模仿系统的材质对象
0.实现点材质.html
1.实现网格材质MeshPhongMaterial.html
知识点.html
ShaderChunk.js
ShaderLib.js
12.着色器——自动提取光源对象信息
0.直接定义光源相关uniform变量值.html
1.从threejs光源对象自动提取值.html
2.通过THREE.ShaderChunk调用着色器代码块.html
知识点.html
bsdfs.glsl
common.glsl
lights_pars_begin.glsl
13.着色器——phong网格材质二次开发
0.Phong片元着色器插入灰度图代码.html
知识点.html
Earth.png
EarthNormal.png
meshphong_frag.glsl
meshphong_vert.glsl
14.WebGLRenderTarget(离屏渲染)
0.立方体场景.html
1.渲染一个场景结果作为另一个场景网格模型贴图.html
知识点.html
15.WebGLRenderTarget实现灰度图后处理功能
0.渲染一个立方体然后处理为灰度图.html
1.后处理结果作为纹理贴图(2个渲染目标对象).html
知识点.html
16.后处理EffectComposer—自定义着色器
扩展库
postprocessing
EffectComposer.js
RenderPass.js
ShaderPass.js
shaders
CopyShader.js
0.自定义后处理着色器.html
1.提取R分量.html
2.多个后处理通道.html
知识点.html
earth.png
17.后处理EffectComposer——直接调用常见通道
postprocessing
EffectComposer.js
FilmPass.js
RenderPass.js
ShaderPass.js
shaders
CopyShader.js
FilmShader.js
0.GlitchPass.html
1.FilmPass.html
2.OutlinePass.html
知识点.html




本资源来源于 网络 付费网站  付费收集而来, 随时收集更新资源  本站专注搜集和分享各种付费网站资源,感谢您的信任


资源下载地址:
游客,如果您要查看本帖隐藏内容请回复>>>开通VIP无需回帖直接下载VIP通道

本站所有资源都来源于网络收集,网友提供或者交换而来!

如果侵犯了您的权益,请及时联系客服,我们即刻删除!




上一篇:后盾人Javascript零基础教程,全面讲解ES,百度云网盘下载
下一篇:2020年最新北京HTML5逆战班,H5教程百度云盘下载
回复

使用道具 举报

客服客服

客服客服

客服客服

客服QQ
微信扫一扫
自助开通会员后联系客服

QQ- Archiver-手机版-小黑屋- 资源分享教程网

中国互联网举报中心 北京12318文化市场举报热线 网络110报警服务 蜀ICP备13002521号-1 | 业务许可证:B1.B2-20140071