作者在实习期间，实现了一个 Web3D 风机综合场景，很适合读者借此对Web3D相关知识做一个综合实战入门

物理引擎与cannon.js 不管是通过3D建模软件还是用代码建模（如three.js的内置geometries组合），我们在计算机里建立的模型都是静止的。当然我们可以通过简单的代码设置物体的位置，让

使用现成的库来实现，Panolens已经帮我们把three中初始化场景、相机、控制器、鼠标事件等操作都封装好了，我们只需要关注图片即可

什么是全景图？ 一般我们拍照都是拍一个方向，而全景图是拍上下左右前后 6 个方向，360 度，这样能够立体的记录所在的场景。 那全景图怎么浏览呢？ 全景图拍的是六个方向的图，放在一个平面看会很别扭，所

上次我们用three.js写了一个下雨的动画，主要是用粒子。这次是用three.js搭建了一个小场景。 项目地址依然是：https://github.com/magicsoso/threejs-tutorial.git ，后面three.js的练习demo都放在这里。 虽然很简…

说明: 公司需要做此项目，之前都没接触过，所以个人集合了所有能找到的资料做出了一个demo项目出来，希望对需要的各位有帮助。 （2）所有的变量最好不要在data里面定义，因为模型大一点的话会卡顿等。目前我是在外部定义的。 模型需要放在根目录下，不然会读取不到。 2.使用thre…

1、网格模型合并 此合并不是把几个网格模型放到一个组中，而是进行uv，顶点，矩阵的合并；做个实验,在普通组中，渲染20000个几何体，帧率一般在15帧左右，如果选择合并在绘制20000个几何体，帧率会

参考：火辣辣前端博客 three.js是JavaScript编写的WebGL第三方库。提供了非常多的3D显示功能。在使用的时候，虽然three.js做了优化，但是在使用不恰当的代码，也会产生性能损耗。

本文主要通过两方面来解剖 WebGL & Three.js ：WebGL 背后的工作原理和以 Three.js 为例，讲述框架在背后扮演什么样的角色，希望对大家学习有所帮助。