title: Angular Merge few images
body: <p>Is there any option to merge few images together in angular. I saw one with an HTML 5 coding but  I couldn't get it to work</p>
  
  <pre><code>&lt;canvas id="canvas"&gt;&lt;/canvas&gt;
  &lt;script type="text/javascript"&gt;
    var canvas = document.getElementById('canvas');
    var context = canvas.getContext('2d');
    Image img1 = new Image();
    Image img2 = new Image();
  
    img1.onload = function () {
      canvas.width = img1.width;
      canvas.height = img1.height;
      img2.src = 'imgfile2.png';
    };
    img2.onload = function () {
      context.globalAlpha = 1.0;
      context.drawImage(img1, 0, 0);
      context.globalAlpha = 0.5; //Remove if pngs have alpha
      context.drawImage(img2, 0, 0);
    };
  
    img1.src = 'imgfile1.png';
  
  &lt;/script&gt;
  </code></pre>