title: How to apply a displacement map to a plane in A-Frame?
body: <p>I want to display an image with an associated displacement map in A-Frame. My goal is to give the image a 3D depth effect in the style of Facebook 3D Photos. The image and the depth map are 1024x1024 PNGs.</p>
  
  <p>Here's what I've tried:</p>
  
  <pre><code>&lt;html&gt;
    &lt;head&gt;
      &lt;script src="https://aframe.io/releases/1.0.4/aframe.min.js"&gt;&lt;/script&gt;
      &lt;title&gt;Displacement&lt;/title&gt;
    &lt;/head&gt;
    &lt;body&gt;
      &lt;a-scene&gt;
        &lt;a-assets&gt;
          &lt;img id="texture" src="texture.png"&gt;
          &lt;img id="displacement" src="displacement.png"&gt;
        &lt;/a-assets&gt;
        &lt;a-plane
          src="#texture"
          width="250"
          height="250"
          position="0 0 -200"
          displacement-map="#displacement"
          displacement-bias="0"
          displacement-scale="60"
        &gt;&lt;/a-plane&gt;
      &lt;/a-scene&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>This displays a plane textured with the image, but it's flat with no displacement effect. What am I missing?</p>