blender建模 & threejs开发初体验 | 大帅老猿threejs特训

之前看到过threejs做的各种炫酷的案例，甚是有趣，一直打算自己也能写个demo尝试下，这次就跟着教程来学习下，小小的入个门。

建模

这次是用blender建的模，当然也可以用其他软件。

建模这个其实没啥好说的，各种细节非常琐碎，就是一个熟能生巧的过程。教程对新手还是比较友好的，每一步的具体操作，快捷键等，教程都有讲到。多看几遍视频，入门blender建模不是问题。

也是心有点大，不想完全复制课上讲的场馆，就按自己想法搭个稍微不一样点的。那就来个大话西游（大爱紫霞）里的场景吧。

对于新手来说，建模完全就是一个缓慢而纠结的过程，遇到各种各样的问题自不必说，跟着教程一步步来就好，其中细节此处略过不表。

新手可能会遇到无法插入中文文本的问题，稍微提一下：
由于默认不支持中文，所以添加文本的时候选择下支持中文的字体（比如`Microsoft YaHei`）
然后把需要的文字从别的地方复制过来，在编辑模式下粘贴就OK了

有了大概的模型后，当然想让场景能动起来，像游戏里一样，加入一个人物，并控制着四处走动，参观下场景^_^。

人物模型可以在网上白嫖找一个，比如sketchfab，此处我们先使用教程提供的模型。

一般模型荡下来时都是静态的，要想有走动的动作，还要进行骨骼绑定，之后我们可以获取到走动-walk和静止-idle两种动作。

通过threejs中的动画混合器，可以剪辑（clip）出上面的两种动作

然后判断键盘按下的是否是行走（w）键来对应的播放走动-walk或静止-idle的模型动画

此处crossPlay是做了一个动画切换的优化。

像游戏里一样，视角跟随鼠标进行转动，其实是相机的视角切换，此处我们可以获取到鼠标的移动时的位置，然后计算出clientX的差值，给予一定权重后让人物转动(rotateY)相应角度即可。

先要把相机cameraadd到任务模型

此处依据Raycaster进行了射线碰撞检测，简单来讲，就是以人物中心为起点，向各个方向发出射线，然后检测射线是否与其他物体相交，若相交再根据两个中心点距离来判断是否会发生碰撞。

blender建模真的是细活，一点点抠，很需要耐心啊。。

以上只是一点浅见，这次课程真的是收获蛮多，希望多来点这种课程。