title: A-Frame local image is not loading
body: <pre><code>&lt;!doctype html&gt;
  &lt;html&gt;
    &lt;head&gt;
      &lt;script src="https://rawgit.com/aframevr/aframe/b813db0614ac2b518e547105e810b5b6eccfe1c8/dist/aframe.min.js"&gt;&lt;/script&gt;
    &lt;/head&gt;
    &lt;body&gt;
      &lt;script&gt;
        AFRAME.registerComponent('set-sky', {
          schema: {default: ''},
          init() {
            const sky = document.querySelector('a-sky');
            this.el.addEventListener('click', () =&gt; {
              sky.setAttribute('src', this.data);
            });
          }
        });
      &lt;/script&gt;
  
      &lt;a-scene&gt;
        &lt;a-camera position="0 2 4"&gt;
          &lt;a-cursor color="#4CC3D9" fuse="true" timeout="10"&gt;&lt;/a-cursor&gt;
        &lt;/a-camera&gt;
  
        &lt;a-sphere color="#F44336" radius="1" position="-4 2 0" set-sky="https://c3.staticflickr.com/2/1475/26239222850_cabde81c39_k.jpg"&gt;&lt;/a-sphere&gt;
  
        &lt;a-sphere color="#FFEB3B" radius="1" position="4 2 0" set-sky="32252838043_e8f2be6783_k.jpeg"&gt;&lt;/a-sphere&gt;
  
        &lt;a-sky&gt;&lt;/a-sky&gt;
      &lt;/a-scene&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I'm new to a-frame, have not worked much in java script either. The code above works fine for the referenced image, but does not work for the local image. What is actually i'm doing wrong ? I found this example <a href="https://blog.neondaylight.com/build-a-simple-web-vr-ui-with-a-frame-a17a2d5b484#.nsmrp3jln" rel="nofollow noreferrer">here</a>.</p>