本文的主要内容就是用three.js制作简单场景,并引入ammo.js物理引擎。
bullet引擎和OpenGL结合创建简单的场景
three.js和ammo.js创建简单的场景
创建地形
制作车辆
柔体-绳索
柔体-布料
柔体-有体积的柔体
使用blender引擎模拟物理场景
本节目标是制作一个模板代码,后续开发都在这个模板的基础上继续开发。这一系列教程都是bullet物理引擎简易使用教程,不会涉及很多原理(比如函数的每个参数的具体含义),只有简单的使用方法。
原因:我以前学编程,总是先知其然再探其所以然。能粗略使用,对于初学者的信心提升是非常高的。我自己也是初学者,我以前学东西的时候,总是在这种基础关卡住,而向别人求教的时候,总是直接给你丢个文档过来说读去吧。一开始就读文档对于初学者来说并不是什么好的入门方法,相反,通过一些简单的实例的模仿迅速拾起信心,才是关键。
three.js制作简单场景
整体思路:主函数一共两个,分别是init和animate,作用类似于unity3d中的Start()和Update()。
全局变量一共有如下
// 绘图相关变量
var container, stats;
var camera, controls, scene, renderer;
var textureLoader;
var clock = new THREE.Clock();
init中只有一个子函数initGraphics,其创建一个空场景,并添加一个环境光和一个线性光,线性光可以产生阴影。initGraphics也是为了和后文中的initPhysics区分开。
animate函数的主要作用是更新场景,绘制下一帧,更新相机位置,顺便用stats工具统计一下帧数、每帧需要的时间、内存占用什么的。
本场景除了three.js之外,还引用了OrbitControls.js,stats.min.js,Detector.js三个文件,分别用来添加鼠标控制,状态统计和检测浏览器对webgl的支持。
本场景源码,运行效果,如果你的程序也是一片浅蓝,帧数显示正确,恭喜你运行成功。
添加物理场景
整体思路:在上一个场景的基础上添加初始化物理场景函数initPhysics、物理场景更新函数updatePhysics、将物理场景中的物体和绘图空间中的场景关联起来并添加到两个场景中的函数createRigidBody(前几个demo中物理场景只支持刚体),