Multiple SVG to Canvas to PDF using jsPDF

HTML

<script src="https://mrrio.github.io/jsPDF/dist/jspdf.debug.js"></script>
<script src="https://html2canvas.hertzen.com/build/html2canvas.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/svg.js/2.2.5/svg.js"></script>
<div id="svg"></div>
<div id="svg2"></div>
<div id="div1">
  <header>Hello World</header>
</div>
<button id="download">Download Pdf</button>

CSS

header {
  color: blue;
  font-style: italic;
  font-size: large;
  border-color: red;
  border-style: solid;
  border-width: 2px;
  background: green;
}

#canvas {
  visibility: hidden;
}

#background {
  display: none;
}

#ballon {
  position: absolute;
  top: 50px;
  left: 50px;
  cursor: move;
  opacity: 0.5;
}

JavaScript

$(document).ready(function() {
	/* create an svg drawing */
	var draw = SVG('svg');

	/* draw rectangle */
	var rect = draw.rect(50,50).fill('#f09');
  
  	/* create an svg drawing */
	var draw2 = SVG('svg2');

	/* draw rectangle */
	var circle = draw2.circle(50,50).fill('#f09');

  $('#download').click(function() {
    //create a canvas
    canvas = document.createElement('canvas');
    canvas.id = 'canvas'
    document.body.appendChild(canvas);
    canvas.width = 500;
    canvas.height = 500;
    context = canvas.getContext('2d');
    
   	// take the svg and convert it to a canvas
    temp_img = new Image();
    temp_img.src = "data:image/svg+xml;base64,"+btoa($("#svg").html());
    console.log(temp_img.src)
    
    temp_img2 = new Image();
    temp_img2.src = "data:image/svg+xml;base64,"+btoa($("#svg2").html());

    //add the images
    base_image = new Image();
    context = canvas.getContext('2d');
    context.drawImage(temp_img,0,0);
    context.drawImage(temp_img2,0,200);

    //var doc = new jsPDF('p', 'mm');
    var doc = new jsPDF('p','pt','a4');
    html2canvas($("#canvas"), {
      onrendered: function(canvas) {
        var imgData = canvas.toDataURL(
          'image/png');
        $("#canvas").hide();
     
        doc.addImage(imgData, 'PNG', 10, 200);
        
        doc.addHTML(document.getElementById('div1'), 0, 0, function() {
        	console.log('callback');
          doc.save('sampler-file.pdf');
        });
        
        //doc.save('sample-file.pdf');
      }
    });
  });
});