摘要： 经过前面2篇WebGL射线拾取模型的文章，相信大家对射线和模型面片相交的原理已经有所了解，那么今天我们再深入探究关于射线拾取的一个问题，那就是遍历场景中的所有与射线相交的模型的优化问题。首先我们来复习一下射线拾取模型的原理，请看下图。 我们从上图中可以看到，在frustum视棱台区域中只有一个模型就 阅读全文

摘要： 这篇文章是对射线法raycaster的补充，上一篇文章主要讲的是raycaster射线法拾取模型的原理，而这篇文章着重讲使用射线法要注意的地方。首先我们来看下图。 我来解释一下上图中的originTriangle，这就是Triangle2三角形第一次绘制在空间中的位置，而Triangle2当前的位置 阅读全文

摘要： 今天要把WebGL中一个非常重要的算法记录下来——raycaster射线法拾取模型。首先我们来了解一下为什么要做模型拾取，我们在做webgl场景交互的时候经常要选中场景中的某个模型，比如鼠标拖拽旋转，平移。为了能做到鼠标交互，就首先要能选中场景中的模型对象，这就要用到模型拾取算法，本文仅讨论射线法模 阅读全文

摘要： 今天总结记录一下WebGL中主循环的创建和作用。我先说明什么是主循环，其实单纯的webgl不存在主循环这个概念，这个概念是由渲染引擎引入的，主循环就是利用一个死循环或无截止条件的递归达到定时刷新canvas场景的函数，也就是人们常说的canvas刷新率（fps）。在讨论主循环的用处之前，我们先明确一 阅读全文

摘要： 今天和大家分享的是webgl渲染树形结构的流程。用过threejs，babylonjs的同学都知道，一个大模型都是由n个子模型拼装而成的，那么如何依次渲染子模型，以及渲染每个子模型在原生webgl中的流程是怎样的呢，我就以osg框架为原本，为同学们展示出来。 首先介绍osg框架，该框架是基于open 阅读全文

摘要： 前几天解决了原生WebGL开发中的一个问题，就是在一个场景中绘制多个几何网格特征不同的模型，比如本文所做的绘制多个圆锥和圆柱在同一个场景中，今天抽空把解决的办法记录下来，同时也附上代码。首先声明，圆柱和圆锥的网格生成是我自己写的polyhedron.js模块，如果要加载其他模型，只需要把geomet 阅读全文

摘要： 包围盒子是鼠标选择物体的一种实现方式，当从相机出发，经过鼠标点形成的射线和物体的包围盒子相交时，就代表物体被选中 阅读全文

摘要： ParticleEmitter._inner_material.flags.depth_write = true;ParticleEmitter._inner_material.flags.depth_test = true; 开启粒子材质的深度测试，修正遮挡剔除的错误 阅读全文