title: Sprite isnt loading - Three.JS
body: <p>For some reason my sprite doesn't seem to load in <code>Three.JS</code>.  Can someone help me fix my code?</p>
  
  <p>I'm not sure what exactly is wrong with it... It's probably something simple I've overlooked. The code works fine but the sprite doesn't appear.</p>
  
  <pre><code>&lt;!DOCTYPE HTML&gt;
  &lt;html&gt;
  &lt;head&gt;
  &lt;title&gt;Sprite&lt;/title&gt;
  &lt;/head&gt;
  &lt;style&gt;
  
  &lt;/style&gt;
  &lt;script src="http://www.html5canvastutorials.com/libraries/three.min.js"&gt;&lt;/script&gt;
  &lt;body&gt;
  &lt;div id="container" style = "text-align: center;width: 100%;"&gt;
  &lt;/div&gt;
  &lt;script&gt;
  
   // this function is executed on each animation frame
    function animate(){
      // render
      renderer.render(scene, camera);
  
      // request new frame
      requestAnimationFrame(function(){
          animate();
      });
    }
  
  
    // renderer
    var renderer = new THREE.WebGLRenderer({ antialias: true }); //antialiasing on! :)
    renderer.setClearColorHex( 0xADD8E6, 1 ); //made the colour for the sky blue
    renderer.setSize(720, 600);
    document.body.appendChild(renderer.domElement);
  
    // camera
    var camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 1, 800);
    camera.position.z = 200;
    camera.position.y =160;
    camera.position.x = 30;
        camera.rotation.x = -0.5;
  
  
    // scene
    var scene = new THREE.Scene();
  
       //CODE HERE
  
              var ashTexture = new THREE.MeshBasicMaterial(
          {
          map: THREE.ImageUtils.loadTexture('http://www.mediafire.com/convkey/7344/ra2l3kgscpvjflafg.jpg')
          });
  
          var ashMaterial = new THREE.SpriteMaterial({ 
          map: ashTexture
          })
  
          var Ash = new THREE.Sprite( ashMaterial );
          Ash.scale.set( 64, 64, 1.0 );
          Ash.position.set( 0, 0, 0);
          scene.add(Ash);                 
  
       //CODE ENDS HERE
  
       // add subtle ambient lighting
    var ambientLight = new THREE.AmbientLight(0xbbbbbb);
    scene.add(ambientLight);
  
    // directional lighting
    var directionalLight = new THREE.DirectionalLight(0xffffff);
    directionalLight.position.set(1, 1, 1).normalize();
    scene.add(directionalLight);
  
    // start animation
    animate();
  
  
  &lt;/script&gt;   
  &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>