Skip to content

Instantly share code, notes, and snippets.

@humoyun

humoyun/gist:9495abdf5c1b906b30ddd6528e3161e5

Forked from ichord/gist:9808444
Created January 16, 2018 04:59
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save humoyun/9495abdf5c1b906b30ddd6528e3161e5 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save humoyun/9495abdf5c1b906b30ddd6528e3161e5 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. @ichord ichord created this gist Mar 27, 2014.
    73 changes: 73 additions & 0 deletions gistfile1.html
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,73 @@
    <script src="http://cdnjs.cloudflare.com/ajax/libs/processing.js/1.4.1/processing-api.min.js"></script><html>
    <!--
    Created using jsbin.com
    Source can be edited via http://jsbin.com/pdfjs-helloworld-v2/8598/edit
    -->
    <body>
    <canvas id="the-canvas" style="border:1px solid black"></canvas>
    <input id='pdf' type='file'/>

    <!-- Use latest PDF.js build from Github -->
    <script type="text/javascript" src="https://rawgithub.com/mozilla/pdf.js/gh-pages/build/pdf.js"></script>

    <script type="text/javascript">

    //
    // Disable workers to avoid yet another cross-origin issue (workers need the URL of
    // the script to be loaded, and dynamically loading a cross-origin script does
    // not work)
    //
    PDFJS.disableWorker = true;

    //
    // Asynchronous download PDF as an ArrayBuffer
    //
    var pdf = document.getElementById('pdf');
    pdf.onchange = function(ev) {
    if (file = document.getElementById('pdf').files[0]) {
    fileReader = new FileReader();
    fileReader.onload = function(ev) {
    console.log(ev);
    PDFJS.getDocument(fileReader.result).then(function getPdfHelloWorld(pdf) {
    //
    // Fetch the first page
    //
    console.log(pdf)
    pdf.getPage(1).then(function getPageHelloWorld(page) {
    var scale = 1.5;
    var viewport = page.getViewport(scale);

    //
    // Prepare canvas using PDF page dimensions
    //
    var canvas = document.getElementById('the-canvas');
    var context = canvas.getContext('2d');
    canvas.height = viewport.height;
    canvas.width = viewport.width;

    //
    // Render PDF page into canvas context
    //
    var task = page.render({canvasContext: context, viewport: viewport})
    task.promise.then(function(){
    console.log(canvas.toDataURL('image/jpeg'));
    });
    });
    }, function(error){
    console.log(error);
    });
    };
    fileReader.readAsArrayBuffer(file);
    }
    }
    </script>


    <style id="jsbin-css">

    </style>
    <script>

    </script>
    </body>
    </html>