three.js 的纹理贴图

上一节讲过了几种光照模型下的材质还有就是透明效果，这节讲最常用的纹理材质。这节的主要是给立方体帖纹理图片，纹理贴图如下图所示，将图片贴到网格上，左边的网格是立方体中的一个四边形，每个顶点都是有位置坐标和纹理坐标也叫uv坐标。前几节讲BuffeGeometry的时候提到过一个顶点一个位置坐标一个 uv坐标。uv坐标就是对应的你要贴的图片的坐标，左图（0，1），（1，1），（0，0），（1，0）就是这个网格的uv坐标，表明贴右边的图片的哪个地方，这是刚好把右图贴到左边的网格上。虚线表示了映射关系。试想一下，四边形左边第一个顶点如果纹理坐标是(0.5,1）,那贴出来的图片是什么效果呢？从图片的最上方中间那个点开始映射到左边网格第一个顶点，图片会变形。

这个箱子的信息用BoxBufferGeometry类来创建，基类是BufferGeometry类。是专门用来构建立方体的。
加载一个纹理图片

  let texture = new THREE.TextureLoader