three.js 整体页面创建碰撞项目

讲到 Three.js，就需要先说一下 OpenGL 和 WebGL， OpenGL 是一个跨平台的3D/2D的绘图标准（规范），WebGL（Web Graphics Library）是一种3D绘图协议，它允许把JavaScript和OpenGL 结合在一起运用，但使用WebGL原生的API来写3D程序非常的复杂，同时需要相对较多的数学知识，对于前端开发者来说学习成本非常高。

特征
物理引擎（Ammo.js）与3D渲染对象（Three.js）相结合，用于实时移动，碰撞检测和交互
桌面和移动响应能力，包括键盘和触摸屏控制
使用事件侦听器进行光线投射，用于用户触摸和单击交互
FPS 跟踪器可监控帧速率/渲染性能
使用 webpack 插件压缩资产，以帮助缩短网站加载时间
科技
three.js（3D图形）
Ammo.js（物理引擎）
JavaScript
节点.js
Express （Node.js 框架）
Webpack （模块/依赖捆绑器）
HTML/CSS
托管于 Heroku
Git（版本控制）/ Github用于代码托管
用法
要在本地使用，请克隆存储库，安装依赖项，使用 webpack 的开发服务器运行，然后在浏览器中导航到 localhost：8080：
**源码：**https://github.com/garyone0927/3D