title: Get X and Y pixel coordinates when iterating over HTML5 canvas getImageData
body: <p>I am iterating over some image data pulled from a <code>canvas</code> like so:</p>
  
  <pre><code>var imageData = this.context.getImageData(0, 0, this.el.width, this.el.height);
  var data = imageData.data;
  
  for (var i = data.length; i &gt;= 0; i -= 4) {
      if (data[i + 3] &gt; 0) {
          data[i] = this.colour.R;
          data[i + 1] = this.colour.G;
          data[i + 2] = this.colour.B;
      }
  }
  </code></pre>
  
  <p>How do I calculate the current X and Y pixel coordinates that I am at?</p>