加載和使用紋理

加載和使用紋理需要了解以下幾個方面：在Three.js里加載紋理并應(yīng)用到網(wǎng)格上；使用凹凸貼圖和法線貼圖為網(wǎng)格添加深度和細(xì)節(jié)；使用光照貼圖創(chuàng)建假陰影；使用環(huán)境貼圖在材質(zhì)上添加反光細(xì)節(jié)；使用光亮貼圖，讓網(wǎng)格的某些部分變得“閃亮”；通過修改網(wǎng)格的UV貼圖，對貼圖進(jìn)行微調(diào)；將HTML5畫布和視頻元素作為紋理輸入。本章節(jié)將會從以上幾方面來了解紋理的使用。

1.使用凹凸貼圖創(chuàng)建皺紋

    之前我們學(xué)習(xí)了THREE.MeshPhongMaterial對象的map屬性，知道它用來設(shè)置外部資源作為材質(zhì)的紋理。這里再介紹它的bumpMap屬性，用來實(shí)現(xiàn)凹凸貼圖效果。代碼和創(chuàng)建不同紋理一樣，僅僅多個bumpMap屬性的設(shè)置。代碼如下：

function createMesh(geom, imageFile, bump){                var texture = THREE.ImageUtils.loadTexture("../assets/textures/general/" + imageFile);                var material = new THREE.MeshPhongMaterial({
                    map: texture
                });                if(bump){                    var bumpTex = THREE.ImageUtils.loadTexture("../assets/textures/general/" + bump);
                    material.bumpMap = bumpTex;
                }                var mesh = new THREE.Mesh(geom, material);        &
        
		

        		
網(wǎng)友評論
     		
				

			
			
			
		
		
		
    	
    	
        	

        		
更多精彩分享
        		

        			
        		
        			
	        		
	        		學(xué)習(xí)是年輕人改變自己的最好方式