small medium large xlarge

12 Aug 2014, 04:14
Thomas Koon (13 posts)

I am working on a Slenderman game(you know, the ones where you pee your pants at the slightest thing) and i don’t want to spend 1232017483743289749e3249384320984 hours making detailed structures out of geometries. Can you please tell me how to wrap images around geometries? ;3

12 Aug 2014, 12:00
Chris Strom (278 posts)

Wrapping an image is a three step process. First, you need to store the image on a web server somewhere. Then in your code, you need to create a “Texture” from the image. Lastly, you need to supply that texture to the usual Material.

Something like the following should work:

  var img = new Image();
  var texture = new THREE.Texture(img);
  img.onload = function () { texture.needsUpdate = true; };
  img.src = '';
  texture.needsUpdate = true;

  var material = new THREE.MeshPhongMaterial({map: texture});
  var geometry = new THREE.SphereGeometry(75);
  var head = new THREE.Mesh(geometry, material);

I am not 100% sure that the two lines with needsUpdate are needed, but they helped at some point with my experiments. It is important to have light in your scene when working with images. An example can be found at:

13 Aug 2014, 01:18
Thomas Koon (13 posts)

nice excuse to advertise you blog XD