Creating a mesh based on a height map in Three.js revision 70
An example of creating a mesh based on a height map taken from a loaded up 16bit color file in Three.js rev. 70.
var gt = THREE.ImageUtils.loadTexture( "images/desert_texture.png" ); // load the texture
var mapHeight = THREE.ImageUtils.loadTexture( "images/desert_texture_bw_16bit.png" ); // load the file from which the height data will be taken
mapHeight.anisotropy = 4;
mapHeight.repeat.set( 0.998, 0.998 );
mapHeight.offset.set( 0.005, 0.005 )
mapHeight.wrapS = mapHeight.wrapT = THREE.RepeatWrapping;
mapHeight.format = THREE.RGBFormat;
var gg = new THREE.PlaneGeometry( 6000, 3000, 100, 100 ); // create a three.js plane mesh
var gm = new THREE.MeshPhongMaterial( { color: 0xffffff, map: gt, specular: 0x333333, shininess: 5, bumpMap: mapHeight, bumpScale: 0.85, metal:
false } ); // set the material for the mesh
var ground = new THREE.Mesh( gg, gm ); // create thre mesh
ground.rotation.x = - Math.PI / 2;
ground.material.map.repeat.set( 8, 8 );
ground.material.map.wrapS = ground.material.map.wrapT = THREE.RepeatWrapping;
ground.receiveShadow = true;
ground.position.y = -1490;
scene.add( ground );