title: Render 1 pixel from a 3D array in a HTML5 Canvas using putImageData() and an UInt8ClampedArray
body: <p>I tried my best to render just 1 pixel form a 3D Array in a HTML5 Canvas unsuccessfully.</p>
  
  <p>(I know this has been done before but not with a 3D Array). But converting a 3D array to an Uint8ClampedArray and pushing to an Uint8ClampedArray isn't easy.</p>
  
  <p>HTML5 also doesn't have another way to display a pixel manipulatable image.</p>
  
  <p>Is it correct that putImageData() is for rendering vertical strings of pixels?</p>
  
  <p>Here is my code, the problem is marked with: "WHAT DO I GOTTA DO HERE":</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang="en" + dir="ltr"&gt;
    &lt;head&gt;
      &lt;meta charset="UTF-8"&gt;
      &lt;title&gt;
        Index.html
      &lt;/title&gt;
    &lt;/head&gt;
    &lt;body style="margin: 0px; padding: 0px;"&gt;
      &lt;canvas id="canvas"&gt;
      &lt;/canvas&gt;
      &lt;script&gt;
        let a = new Array();
        a.push([]);
        a[x.length - 1].push([]);
        a[x.length - 1][a[a.length - 1].length - 1].push(0);
        a[x.length - 1][a[a.length - 1].length - 1].push(0);
        a[x.length - 1][a[a.length - 1].length - 1].push(0);
        a[x.length - 1][a[a.length - 1].length - 1].push(255);
        document.getElementById("canvas").getContext("2d").putImageData(new 
        ImageData(new Uint8ClampedArray("WHAT DO I GOTTA DO HERE"), 1, 1), 1, 
        1);
      &lt;/script&gt;
    &lt;/body&gt;    
  &lt;/html&gt;
  </code></pre>
  
  <p>To test it you can use:</p>
  
  <pre><code>console.log(a);
  console.log(a[0]);
  console.log(a[0][0]);
  console.log(a[0][0][0]);
  </code></pre>