学习Three.js——纹理(Texture)

一般使用THREE.ImageUtils.loadTexture(img_path)将图像加载为纹理，然后将纹理赋给材质的map属性，

其中我们可以选择纹理放大和缩小使用的插值算法。

THREE.NearestFilter、THREE.LinearFilter、THREE.NearestMipMapNearestFilter、THREE.NearestMipMapLinearFilter、THREE.LinearMipMapNearestFilter和THREE.LinearMipMapLinearFilter

详细说明自行百度。

使用凹凸贴图创建皱褶

使用凹凸贴图创建一种新的纹理，将其赋给材质的bumpMap属性，并调整bumpScale即可获得凹凸的效果

function createMesh(geom, imageFile, bump) {
   
            var texture = THREE.ImageUtils.loadTexture("../assets/textures/general/" + imageFile);
            geom.computeVertexNormals();
            var mat = new THREE.MeshPhongMaterial();
            mat.map = texture;

            if (bump) {
   
                var bump = THREE.ImageUtils.loadTexture("../assets/textures/general/" + bump);
                mat.bumpMap = bump;
                mat.bumpScale = 0.2;
                console.log('d');
            }


            // create a multimaterial
            var mesh = new THREE.Mesh(geom, mat);

            return mesh;
        }

使用法向贴图创建更加细致的凹凸和皱褶

凹凸贴图只有高度信息而没有斜角的信息&