摘要：
郭先生今天继续说一说cannon.js物理引擎，并用之前已经学习过的知识实现一个小动画，知识点包括ConvexPolyhedron多边形、Shape几何体、Body刚体、HingeConstraint铰链约束等等知识。因为我之前用纯three.js 的THREEBSP实现过一个静态的齿轮，现在就想配 阅读全文
摘要：
今天郭先生继续讲cannon.js的物理约束，之前的一篇文章曾简单的提及过PointToPointConstraint约束，那么今天详细的说一说cannon.js的约束和使用方法。在线案例请点击博客原文。 1. cannon.js约束的种类 1. PointToPointConstraint点对点约 阅读全文
摘要：
年后第一天上班，郭先生来说一说cannon.js的ConvexPolyhedron（多边形），cannon.js是一个物理引擎，内部通过连续的计算得到各个时间点的数据的状态，three.js的模型可以定时的应用这些状态来达到运动的效果，但是在应用的时候cannon数据模型和three模型一般都是不同 阅读全文
摘要：
关于cannon.js我们已经学习了一些知识，今天郭先生就使用已学的cannon.js物理引擎的知识配合three基础知识来做一个保龄球小游戏，效果如下图，在线案例请点击博客原文。 我们需要掌握的技能点，就是已经学过的cannon.js物理引擎知识、three.js车削几何体、threeBSP和简单 阅读全文
摘要：
今天郭先生说一说使用cannon.js的车辆辅助类让我们的汽车模型拥有物理特性。效果图如下，在线案例请点击博客原文。 下面我们说一下今天要使用的两个类，并简单的看看他们的物理意义 1. RaycastVehicle类 这是车辆辅助类，将光线从车轮位置投射到地面并施加力。它决定车的位置，角度，质量等信 阅读全文
摘要：
今天郭先生说一说cannon.js物理引擎之Heightfield高度场，学过场论的朋友都知道物理学中把某个物理量在空间的一个区域内的分布称为场，高度场就是与高度相关的场，而cannon.js物理引擎的Heightfield的高度就是关于两个变量的函数，可以表达为HEIGHT(i,j)。当然知不知道 阅读全文
摘要：
今天郭先生说一说使用cannon.js物理引擎绘制地形和使用指针锁定控件。效果如下图。线案例请点击博客原文。 这里面的生成地形的插件和指针锁定控件也是cannon.js的作者schteppe封装的，当然也可以自己写一个这样的小插件。好的我们先说说这两个插件的使用方法，然后结合一个小案例应该他们。 1 阅读全文
摘要：
今天郭先生继续说cannon.js，主演内容就是点对点约束和2D坐标转3D坐标。仍然以一个案例为例，场景由一个地面、若干网格组成的约束体和一些拥有初速度的球体组成，如下图。线案例请点击博客原文。 下面来说说如何使用约束来完成一个这样的物理场景。 1. 创建three场景 这一步是基础工作，对于有一定 阅读全文
摘要：
今天郭先生说的是一个物理引擎，它十分小巧并且操作简单，没错他就是cannon.js。这些优点都源自于他是基于js编写的，对于js使用者来说cannon.js拥有其他物理引擎没有的纯粹性。从学习成本来看，cannon.js的学习成本比较低，对于新手来说比较友好，因为它有相对完善的api，学习canno 阅读全文
摘要：
今天郭先生说一下WebWorker以及WebWorker在three.js中的应用。我们都知道Javascript是单线程的，比如执行js代码的同时UI渲染就会停止，对于多核CPU的点脑，这一点让人难以接受，好在Web Worker的出现多少解决了一些问题。官方说Web Worker指的是一种可由脚 阅读全文
摘要：
今天郭先生说一下如何在three中显示中文字体，然后结合tween实现文字位置的动画。线案例请点击博客原文。 1. 生成中文字体 我们都使用过three.js的FontLoader加载typeface.json实现font的使用，但是很多案例都是英文字体，那么如何来生成中文字体呢？现在我们可以通过F 阅读全文
摘要：
今天郭先生说一说WebGLRenderTarget，它是一个缓冲，就是在这个缓冲中，视频卡为正在后台渲染的场景绘制像素。 它用于不同的效果，例如把它做为贴图使用或者图像后期处理。线案例请点击博客原文。 话不多说，下来看看他的属性了方法。 1. WebGLRenderTarget的属性和方法 WebG 阅读全文
摘要：
书接上回，这一节我们分模块说一说怎么写一个这样的游戏 1. 初始化场景、相机和渲染器 这几乎是绘制three必须做的事情，我们有两套场景和相机，一个是主场景和相机，另一个是小地图的场景和相机（用来俯视建筑和小汽车），渲染器设置一级曝光，输出编码设置为sRGBEncoding，代码如下。 scene 阅读全文
摘要：
之前一段时间家里和公司的事太多，一直没有时间写博客，最近腾出一段时间，看了一遍官方的examples，收获颇多，想整理一点东西出来，又苦于没有好的东西，three写点东西真是太难了。好吧，今天郭先生就写一个小汽车的3D游戏，如下图 这个游戏几乎没用新的知识点，用了只有有向包围盒OBB。官方demo， 阅读全文
摘要：
上一篇已经对绕非定轴转动有所了解，这篇郭先生继续说一说逻辑转体游戏的制作，这部分我们同样会遇到一些小问题，首先是根据数据渲染陷阱和目标区域，然后是对可以转动的判定，最后是获胜的判定。 1. 根据数据渲染陷阱和目标区域 首先我们P一张底图和陷阱图，如下图 就像这样，然后就是根据数据渲染陷阱和目标区域了 阅读全文
摘要：
今天郭先生又出来制作游戏了，最近有小伙伴要做一个逻辑转体小游戏，我怎么能不先来试试呢。玩法可以看上面的连接，下面附几张图。线案例请点击博客原文。 游戏规则不懂得可以看自行百度哈，其实玩起来还挺有难度的。关于这个问题，对于新手来说，主要需要克服两个困难。一是这个模型的旋转轴不是固定的，每一次的旋转都是 阅读全文
摘要：
最近有three网友，问我要不要学习blender，其实我感觉学习一下也无妨，不过花大量时间精通，尚可不必，术业有专攻给别人留一条路吧，哈哈。那我我们就是用ThreeBSP和uv贴图的知识来制作一个定制化的快递柜，先上图，在线案例请点击博客原文。 下面我们来讲解一下这样一个柜子的制作。 1. 主角是 阅读全文
摘要：
今天郭先生来说一说uv映射，什么是uv映射？uv映射就是将二维的贴图映射到对象的一个面（或者多个面）上。说到这个问题，我们就不得不了解一下Geometry的点、面和uv的结构。我们以BoxGeometry为例。 new THREE.BoxGeometry(20, 20, 20); //创建一个边长为 阅读全文
摘要：
这篇郭先生说一下three.js着色器的内置变量，分别是 gl_PointSize：在点渲染模式中，控制方形点区域渲染像素大小（注意这里是像素大小，而不是three.js单位，因此在移动相机是，所看到该点在屏幕中的大小不变） gl_Position：控制顶点选完的位置 gl_FragColor：片元 阅读全文
摘要：
这一篇书接上文，说一说剩下的一些模块。 1. 机箱存储占用比率 机箱存储占用比其实很简单，就是在机箱上新加一个组即可，然后根据比率值来设置颜色，这个颜色我们去HSL(0.4,0.8,0.5) ~ HSL(0,0.8,0.5)就是从绿色到红色。我们就不多废话了。 2. 监控摄像视角 监控摄像相机我在强 阅读全文