three.js学习笔记(二)——textures纹理

什么是纹理Texture

简单来说,纹理就是覆盖几何体表面的图像。不同的纹理类型具有不同的效果。

纹理加载器TextureLoader

// 初始化一个纹理加载器,然后用.load()加载纹理贴图
const textureLoader = new THREE.TextureLoader()
const colorTexture = textureLoader.load('/textures/door/color.jpg')
// 之后使用纹理来创建材质
const material = new THREE.MeshBasicMaterial({
    map:colorTexture  })

注:一个纹理加载器可以加载多个纹理
three.js学习笔记(二)——textures纹理_第1张图片
在图片路径后还可以再添加三个回调函数

const colorTexture = textureLoader.load(
    '/textures/door/color.jpg',
    ()=>{
     //加载完成时将调用
         console.log('load');
     },
    ()=>{
      //加载过程中进行调用(一般不会用到)
         console.log('progress');
     },
    ()=>{
     //加载出错时调用
         console.log('error'

你可能感兴趣的:(three.js学习笔记,javascript,three.js)