如何用three.js在微信小游戏里绘制并实现一个旋转的三角形动画效果？

本文共计1707个文字，预计阅读时间需要7分钟。

three.js是一个基于JavaScript绘制3D图形的库，它对WebGL的API进行封装，使得开发更加方便，就像jQuery对DOM的API进行封装一样。接下来，记录一下在小游戏中小步快跑中绘制一个旋转的三角形的步骤。

three.js是一个可以使用javascript绘制3d图形的库，它对WebGL的api进行封装，使开发更加方便，就像jQuery对DOM的api进行封装一样。接下来就记录一下在小游戏中绘制一个 旋转的三角形的步骤：

一. 初始化项目

下载微信官方的开发者工具，然后新建项目

appid选择测试号即可，项目路径自行指定

用编辑器打开项目，得到如下目录：

然后除了game.js，game.json, project.config.json全部删除，并把game.js中的内容清空。

game.js是整个小游戏的入口，game.json是小游戏配置。具体参考文档。

二. 引入three.js 和 Adapter

Adapter

小游戏的运行环境中是没有 BOM 和 DOM 的，使用 wx API 模拟 BOM 和 DOM 的代码组成的库称之为 Adapter。官方提供了一个Adapter，用它就行了。