title: How to add multiple image to canvas using fabricjs
body: <p>I have read several questions/answers about this topic, but I can't seem to find my solution. So sorry if you guys find this question duplicated.</p>
  
  <p>Here is my situation;
  Let's say I have a menu for user to click on it and it will display the image of that selected item on canvas, also user can resize/drag/drop that image as they want. Right now I can make it works only one time with this code</p>
  
  <pre><code>addAction(selectedAction: any) {
    var canvas = new fabric.Canvas('c');
    var imgObj = new Image();
    imgObj.src = selectedAction.image;
    imgObj.onload = function() {
      var imgInstance = new fabric.Image(imgObj, {
          left: 200,
          top: 200,
        });
      canvas.add(imgInstance);
    }
  </code></pre>
  
  <p>The problem is when user click another item in the menu, the previous item that was on the canvas disappear, instead the current item display on the canvas. But if I click on that image, it will disappear and the previous image display on the canvas.</p>
  
  <p>I want them BOTH stay on the canvas at the same time. Please advice.</p>