babylonjs 分部加载模型_使用 Babylon.js 在 HTML 页面加载 3D 对象

五一 Windwos Blogs 推了一篇博客， Babylon.js v3.2 发布了。因为一直有想要在自己博客上加载 3D 对象的冲动，这两天正好看到了，就动手研究研究。本人之前也并没有接触过 WebGL ，这方面算是知识盲区，需求完成之后感觉非常炫酷，顺手写篇博客记录下来。不得不说 3D 打印和 VR 慢慢的开始走进平时的生活了，技术的成熟与硬件成本的变低，结合内容跨平台共享与各种简单的 js 框架， WebGL 和 WebVR 很可能就是未来 Web 方向的主流技术。期待美好而炫酷的未来ing

Babylon.js 是什么

Babylon.js 是一个 JavaScript 开源框架，可以在浏览器或 Web 应用程序中简单便捷的构建 3D 游戏和 WebGL、WebVR 等 3D 体验。Babylon.js 非常强大，强大到可以去构建商业游戏。毕竟我才花了两天时间去了解它，只用来加载 3D 对象确实是大材小用了，文档和 GitHub 地址在下面。

基本代码

Babylon.js 并不是所有的 3D 对象都支持，支持的类型： .glTF 、 .obj 、 .stl 、 .babylon 。

这里以 STL 对象为例，首先需要引入两个 js 文件。一个是 Babylon.js ，另一个是 STL Loader， js 文件在 GitHub 中自行搜索下载引入。

同时还需要一个 HTML5 的 canvas 标签作为 Babylon.js 的渲染容器

紧接着注册一个 DOM 事件，我们的渲染代码将在事件里完成，以确保执行渲染之前加载整个 DOM 。

window.addEventListener('DOMContentLoaded', function() {