three.js是时下比较火的前端WebGL javascript框架！~国内学习资料普遍较少！~今天来介绍一下如何使用three.js 画一个简单的足球，并为其进行粗略的贴图。
工具/原料
1
sublime text编辑器
2
本地 nginx 服务器
方法/步骤
1
首先我们在自己本地服务器的根目录建立一个html文件，并命名为football.html.
2
然后我们使用sublime text 编辑器将这个html文件打开，并在里面写入基本html代码，且引入需要的three.min.js库！~这里还引入了一个OrbitControlers.js库，这个后面用来控制相机使用。
3
接着我们来写自己的逻辑代码！首先定义并初始化一个相机！~~相机就好像是我们的眼睛，可以帮助我们来看场景中的东西。
4
然后我们定义并初始化一个场景，场景就好像是我们周边的环境。里面可以放形形色色的东西，供我们的眼睛，即相机进行拍照。
5
紧接着我们定义并初始化一个渲染器，渲染器会帮助我们把相机拍下来的东西进行渲染，这样就物体可以呈现在画布上了。
6
因为我们要画个足球，所以我们接着定义并初始化一个球体的几何体。
8
创建好足球cube还不算结束，我们还需要把这个cube 添加到场景中，即我们周围的环境中，这样我们才能在这个场景中看到这个足球。
9
好了，场景中也有足球了，我们来用渲染器把相机在场景中看到的东西给渲染出来吧！~~这里写一个动画函数，并进行调用！~~
10
好，我们通过浏览器来进行访问，就可以看到足球渲染到屏幕上啦！
11
我们拖动鼠标，旋转中间，发现足球并没有什么变化。我们想要让我们的足球离我们更近一些，那么我们就需要控制相机了。这里就需要OrbitControler了。添加如图中的代码，再转动滚轮，你会发现足球离你更近了。
12
到此，这个用three.js画的足球就展现在你面前了。但是有点不足，就是这个足球贴图贴的好像不是那么好，两极的贴图被挤在了一起，且越往两极贴图好像就被拉伸了。这个暂时还不知道怎么弄，有知道的小伙伴可以私信或有得告知一下哈！
上一篇：qq红包足球怎么画