javascriptthree.jsbump-mapping

Bump map give no effect on texture in three.js


I am using THREE.ImageUtils to load maps and bumpmaps.The grayscale image of the maps are used as bumpmaps .on adding bump maps it doesnt gives any effect on it.

var material = new THREE.MeshLambertMaterial({ side: THREE.DoubleSide });

material.map = THREE.ImageUtils.loadTexture('http://i.imgur.com/ZjBRB2d.jpg');
material.bumpMap = THREE.ImageUtils.loadTexture('http://i.imgur.com/tz483el.jpg'); 

code

Is Repeat Wrapping of bumpmaps are possible as maps ?


Solution

  • MeshLambertMaterial does not support bump maps. Try MeshPhongMaterial or MeshStandardMaterial.

    Bump maps support repeat wrapping, but as explained in this answer if you have a diffuse map, too, the map and bump map must have the same repeat setting.

    This limitation may be changed in a future release.

    three.js r.77