【WebGL简易教程(十四)：阴影】的更多相关文章

WebGL简易教程(十四)：阴影

目录 1. 概述 2. 示例 2.1. 着色器部分 2.1.1. 帧缓存着色器 2.1.2. 颜色缓存着色器 2.2. 绘制部分 2.2.1. 整体结构 2.2.2. 具体改动 3. 结果 4. 参考 1. 概述 所谓阴影,就是物体在光照下向背光处投下影子的现象,使用阴影技术能提升图形渲染的真实感.实现阴影的思路很简单: 找出阴影的位置. 将阴影位置的图元调暗. 很明显,关键还是在于如何去判断阴影的位置.阴影检测的算法当然可以自己去实现,但其实OpenGL/WebGL已经隐含了这种算法:假设摄像…

WebGL简易教程(十二)：包围球与投影

目录 1. 概述 2. 实现详解 3. 具体代码 4. 参考 1. 概述 在之前的教程中,都是通过物体的包围盒来设置模型视图投影矩阵(MVP矩阵),来确定物体合适的位置的.但是在很多情况下,使用包围盒并不方便计算,可以利用包围盒再生成一个包围球,利用包围球来设置MVP矩阵. 在<WebGL简易教程(十):光照>中,给地形赋予了固定方向的平行光.这篇教程的例子就是想模拟在平行光的视角下地形的情况.对于点光源光,可以用透视投影来实现渲染的效果:而平行光就需要通过正射投影来模拟.并且,这种正射并不是…

WebGL简易教程(十)：光照

目录 1. 概述 2. 原理 2.1. 光源类型 2.2. 反射类型 2.2.1. 环境反射(enviroment/ambient reflection) 2.2.2. 漫反射(diffuse reflection) 2.2.3. 综合 3. 实例 3.1. 具体代码 3.2. 改动详解 3.2.1. 设置日照 3.2.2. 着色器光照设置 4. 结果 5. 参考 1. 概述 在上一篇教程<WebGL简易教程(九):综合实例:地形的绘制>中,实现了对一个地形场景的渲染.在这篇教程中,就给这个地…

WebGL简易教程(十五)：加载gltf模型

目录 1. 概述 2. 实例 2.1. 数据 2.2. 程序 2.2.1. 文件读取 2.2.2. glTF格式解析 2.2.3. 初始化顶点缓冲区 2.2.4. 其他 3. 结果 4. 参考 5. 相关 1. 概述 一般来说,图形渲染总是需要从磁盘数据开始,最终保存到磁盘数据中,保存这种数据的就是3D模型文件.3D模型文件一般会把顶点.索引.纹理.材质等等信息都保存起来,方便下次直接读取.3D模型文件格式一般是与图形渲染工作强关联的,了解3D模型文件格式的组成,有助于进一步了解图形渲染的流程.…

WebGL简易教程——目录

目录 1. 绪论 2. 目录 3. 资源 1. 绪论 最近研究WebGL,看了<WebGL编程指南>这本书,结合自己的专业知识写的一系列教程.之前在看OpenGL/WebGL的时候总是感觉OpenGL/WebGL看的时候懂,实际用起来却挺难,感觉中间总是隔着很多东西.现在一路边学边写,才明白这中间缺少的其实就是总结,是实践:把这个过程写出来,既是帮助他人,也是帮助自己. 现在这一系列文章也写了不少了,就写个目录汇总一下,方便查阅,以后增添了新的文章也会随之更新.这一系列教程由浅入深,知识也是循…

WebGL简易教程(四)：颜色

目录 1. 概述 2. 示例:绘制三角形 1) 数据的组织 2) varying变量 3. 结果 4. 理解 1) 图形装配和光栅化 2) 内插过程 5. 参考 1. 概述 在上一篇教程<WebGL简易教程(三):绘制一个三角形(缓冲区对象)>中,通过使用缓冲区对象(buffer object)来向顶点着色器传送数据.那么,如果这些数据(与顶点相关的数据,如法向量.颜色等)需要继续传送到片元着色器该怎么办呢? 例如这里给三角形的每个顶点赋予不同的颜色,绘制一个彩色的三角形.这个时候就需要用到之…

WebGL简易教程(九)：综合实例：地形的绘制

目录 1. 概述 2. 实例 2.1. TerrainViewer.html 2.2. TerrainViewer.js 3. 结果 4. 参考 1. 概述 在上一篇教程<WebGL简易教程(八):三维场景交互>中,给三维场景加入了简单的交互,通过鼠标实现场景的旋转和缩放.那么在这一篇教程中,综合前面的知识,可以做出一个稍微复杂的实例:绘制一张基于现实的地形图. 地形也就是DEM(数字高程模型),是由一组网格点组成的模型,每个点都有x,y,z值:更简单来说,图像格式就可以作为DEM的载体,只不…

WebGL简易教程(十三)：帧缓存对象(离屏渲染)

目录 1. 概述 2. 示例 2.1. 着色器部分 2.2. 初始化/准备工作 2.2.1. 着色器切换 2.2.2. 帧缓冲区 2.3. 绘制函数 2.3.1. 初始化顶点数组 2.3.2. 传递非公用随帧不变的数据 2.3.3. 逐帧绘制 3. 结果 4. 参考 1. 概述 事物是普遍联系的.为了达到更加真实的渲染效果,很多时候需要利用被渲染物体在其他状态下的中间渲染结果,处理到最终显示的渲染场景中.这种中间渲染结果,就保存在帧缓冲区对象(framebuffer object,简称FBO)中…

无废话ExtJs 入门教程十四[文本编辑器：Editor]

无废话ExtJs 入门教程十四[文本编辑器:Editor] extjs技术交流,欢迎加群(201926085) ExtJs自带的编辑器没有图片上传的功能,大部分时候能够满足我们的需要. 但有时候这个功能还是需要的.我在这里对keeditor进行了整合. 首先要下载keeditor和上传时需要引用的LitJson.dll.由于ke的版本不同,我这里提供的下载文件只适用于当前整合代码,供参考. 1.代码如下: 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML…

Ocelot简易教程（四）之请求聚合以及服务发现

上篇文章给大家讲解了Ocelot的一些特性并对路由进行了详细的介绍,今天呢就大家一起来学习下Ocelot的请求聚合以及服务发现功能.希望能对大家有所帮助. 作者:依乐祝 原文地址:https://www.cnblogs.com/yilezhu/p/9695639.html 请求聚合 Ocelot允许你声明聚合路由,这样你可以把多个正常的ReRoutes打包并映射到一个对象来对客户端的请求进行响应.比如,你请求订单信息,订单中又包含商品信息,这里就设计到两个微服务,一个是商品服务,一个是订单服务.…