Untitled

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" type="text/css" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" crossorigin="anonymous">
    <script src="//code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>
    <script src="//cdn.bootcss.com/jspdf/1.3.3/jspdf.debug.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.min.js"></script>
    <script src="//cdn.bootcss.com/Base64/1.0.1/base64.js"></script>
    <script src="//cdn.jsdelivr.net/canvas2image/0.1/canvas2image.js"></script>
</head>
<style>
    body {
        background-color: #fff;
    }
    .bg-white {
        background-color: #fff;
    }
</style>
<body style="width: 1200px;">
<div id="widget" class="widget" style="width: 100%;">
    <h3 class="bg-white" style="margin: 0">This is demo on how to convert html to pdf</h3>
    <table class="table bg-white">
        <tr>
            <td>wewe</td>
            <td>ewewew</td>
            <td>wewe</td>
            <td>ewewew</td>
        </tr>
        <tr>
            <td>fgfggfg</td>
            <td>fgggfgfggfg</td>
            <td>wewe</td>
            <td>ewewew</td>
        </tr>
        <tr>
            <td>wewe</td>
            <td>ewewew</td>
            <td>wewe</td>
            <td>ewewew</td>
        </tr>
        <tr>
            <td>fgfggfg</td>
            <td>fgggfgfggfg</td>
            <td>wewe</td>
            <td>ewewew</td>
        </tr>
        <tr>
            <td>wewe</td>
            <td>ewewew</td>
            <td>wewe</td>
            <td>ewewew</td>
        </tr>
        <tr>
            <td>fgfggfg</td>
            <td>fgggfgfggfg</td>
            <td>wewe</td>
            <td>ewewew</td>
        </tr>
    </table>
</div>
<div id="pdf"></div>
<br/>
<input type="button" id="btnSave" value="Save PDF" />

<script>
$(function() {
    var height = $('#widget').outerHeight();
    var width = $('#widget').outerWidth();
    console.log(height + 'x' + width);

    // 600 x 222  120 x 80
    // max with 120 so 120/600 222*1
    var pdfWdith = 200; //portrait full width
    var pdfHeight = 80;
  function createPDF(imgData) {
    var doc = new jsPDF();
    doc.addImage(imgData, 'JPEG', 10, 10, pdfWdith, pdfHeight, 'monkey');
    doc.output('datauri');
  }

  $("#btnSave").click(function() {
    html2canvas($("#widget"), {
     onrendered: function(canvas) {
        theCanvas = canvas;
                createPDF(theCanvas)
      }
   });
  });

});
</script>
</body>
</html>