WebGL进阶共6篇

使用VBO、IBO创建彩色甜圈圈(WebGL进阶01)-卡核

使用VBO、IBO创建彩色甜圈圈(WebGL进阶01)

使用VBO、IBO创建彩色甜圈圈 1. demo效果2. 实现要点2.1 初始化顶点信息2.2 向着色器传值2.3 注册鼠标拖拽事件 3. demo代码 1. demo效果 2. 实现要点 2.1 初始化顶点信息 如上图绘制甜圈圈的思...
点燃火柴的头像-卡核点燃火柴1个月前
06101168
三维模型平行光照射实现(WebGL进阶02)-卡核

三维模型平行光照射实现(WebGL进阶02)

三维模型平行光照射实现 1. demo效果2. 知识要点2.1 平行光照射2.2 物体变换时表面法线处理 3. 实现要点3.1 顶点着色器3.2 相关矩阵计算 4. demo代码 1. demo效果 上图是平行光照射下效果 上图...
点燃火柴的头像-卡核点燃火柴1个月前
04142346
三维模型环境光照射实现(WebGL进阶03)-卡核

三维模型环境光照射实现(WebGL进阶03)

三维模型环境光照射实现 1. demo效果2. 环境光介绍3. 实现要点3.1 顶点着色器调整3.2 向着色器中传值环境光颜色 4. demo代码 1. demo效果 上图是平行光照射下效果 上图是平行光+环境光照射...
点燃火柴的头像-卡核点燃火柴1个月前
04576981
三维模型反射光照射实现、物体表面高光实现(WebGL进阶04)-卡核

三维模型反射光照射实现、物体表面高光实现(WebGL进阶04)

三维模型反射光照射实现 1. demo效果2. 反射光介绍3. 实现要点3.1 反射光计算3.2 向着色器传值 4. demo代码 1. demo效果 2. 反射光介绍 反射光分为漫反射和镜面反射,平行光属于慢反射。...
点燃火柴的头像-卡核点燃火柴1个月前
09696466
WebGL三维模型实现Phong着色(WebGL进阶05)-卡核

WebGL三维模型实现Phong着色(WebGL进阶05)

WebGL三维模型实现Phong着色 1. demo效果2. Phong着色与Gouraud 着色2.1Gouraud 着色2.2 Phong 着色 3. 实现要点4. demo代码 1. demo效果 2. Phong着色与Gouraud 着色 通过前面几篇文章,...
点燃火柴的头像-卡核点燃火柴1个月前
05032525
WebGL使用点光源照明(WebGL进阶06)-卡核

WebGL使用点光源照明(WebGL进阶06)

使用点光源照明 1. demo效果2. 点光源介绍3. 实现要点3.1 片元着色器中计算点光源3.2 准备绘制物体的数据3.3 绘制物体 4. demo代码 1. demo效果 上图效果为原点处有点光源照射的效果 2. 点光源...
点燃火柴的头像-卡核点燃火柴1个月前
08677755