title: HTML5, can I create an Image object from an ImageData object?
body: <p>I have the function <code>setHighlight</code> for my game that draws an image to an in-memory canvas, highlights any pixels in the <code>ImageData</code> object that aren't an rgba value of [0,0,0,0] to green; however, I want to store this newly created <code>ImageData</code> object in my object, or "class", variable.</p>
  
  <p>I have two object variables, one called <strong>parentResource</strong> and <strong>parentResourceHighlight</strong>.</p>
  
  <p><strong>parentResource</strong> is the original, unchanged <code>Image</code> object. I want to store the edited <code>ImageData</code> object returned from the <code>setHighlight</code> function in the <strong>parentResourceHighlight</strong> variable, so it can later be drawn with the <code>drawImage</code> function. How can I do this?</p>
  
  <p>I know I can use <code>putImageData</code> to draw the newly created data, but I need to use <code>drawImage</code> instead. And as for as I know, an <code>ImageData</code> object (which is returned by my function) does not work with it. Is there a way I can use <code>putImageData</code> to draw the image and then copy that from the canvas bitmap into an actual <code>Image</code> or draw-able object?</p>
  
  <p><strong><em>tl;dr "HTML5, can I create an Image object from an ImageData object?"</em></strong></p>
  
  <p>Thanks, I hope I made my question clear! If you are confused by any parts, please say so.</p>