title: ThreeJS Bitmap Texture on THREE.Shape extrude
body: <p>I'm successfully drawing a cube with rounded corners by using the <code>THREE.Shape</code> object:</p>
  
  <pre><code>var shape = new THREE.Shape();
  x = width/2;
  y = height/2;
  shape.moveTo(x - radius, y);
  
  //*** Top right
  x = -width/2;
  y = height/2;
  shape.lineTo(x + radius, y);
  if (tr) shape.quadraticCurveTo(x, y, x, y - radius);
  else shape.lineTo(x, y);
  
  //*** Bottom right
  x = -width/2;
  y = -height/2;
  shape.lineTo(x, y + radius);
  if (br) shape.quadraticCurveTo(x, y, x + radius, y);
  else shape.lineTo(x, y);
  
  //*** Bottom left
  x = width/2;
  y = -height/2;
  shape.lineTo(x - radius, y);
  if (bl) shape.quadraticCurveTo(x, y, x, y + radius);
  else shape.lineTo(x, y);
  
  //*** Top left
  x = width/2;
  y = height/2;
  shape.lineTo(x, y - radius);
  if (tl) shape.quadraticCurveTo(x, y, x - radius, y);
  else shape.lineTo(x, y);
  
  var extrude = this.shape.extrude({amount: extr || 0, bevelEnabled: false});
  this.mesh = new THREE.Mesh(extrude, mat);
  </code></pre>
  
  <p>The issue is that I need to treat this mesh as you would with a <code>CubeGeometry</code> and texture it with a bitmap (and eventually video) texture. The current result is the front face of the cube is split into four equal segments, each a single color from what does appear to be pixel data from the bitmap. In this instance, I am only concerned with the front face of the cube.</p>