title: appendChild dataURI image to window.open failing in IE
body: <p>I am trying to grab an image from an interactive map using dataURI. That image is then appended to a new window layout for printing.</p>
  
  <p>This works in Firefox and Chrome but not in IE11 or Edge which both throw errors.
  IE: "HierarchyRequestError"
  Edge: "No such interface supported"</p>
  
  <p><a href="https://stackoverflow.com/questions/17017682/appendchild-not-working-with-window-open-in-ie">This question</a> is very similar but unanswered and the offered solutions relate to objects other than image data.</p>
  
  <p>I suspect <a href="https://stackoverflow.com/questions/23097024/internet-explorer-throws-script5022-hierarchyrequesterror-when-trying-to-append">this method</a> might work but i can't figure out how to implement it properly for a URI.</p>
  
  <p>Current code working in FF and Chrome;</p>
  
  <pre><code>function screen(){
  
  var simg = new Image();
  var dataURL = map.getCanvas('#map').toDataURL();
  
  simg.src = dataURL;
  
  var mywindow = window.open('about:blank','Print','height=800,width=900');
  var is_chrome = Boolean(mywindow.chrome);
  
  mywindow.document.write('&lt;!DOCTYPE html&gt;&lt;head&gt;');
  mywindow.document.write('&lt;link rel="stylesheet" href="./css/scr.css" type="text/css" /&gt;');
  mywindow.document.write('&lt;/head&gt;&lt;body&gt;'); 
  //add logos and legend here.
  mywindow.document.write('&lt;/div&gt;&lt;/body&gt;&lt;/html&gt;');
  mywindow.document.body.appendChild(simg);
  
          if (is_chrome) {
              setTimeout(function () { 
                      mywindow.document.close();
                      mywindow.focus(); 
                      mywindow.print();  
                      mywindow.close();
              }, 600);
          } else {
  
      mywindow.document.close(); 
      mywindow.focus(); 
      mywindow.print();
      mywindow.close();       
  
      }
      return true;    
  }
  </code></pre>