JavaScript
pdf.js

PDF.jsを使って、pdfファイルを出力する

コミックサイト作成した時に使用しました。

pdfファイルのページ数に対して、canvasを生成し
pdfファイルをレンダリングしています。
以下がコードになります。

(function(){
  var url = 'file.pdf';

  PDFJS.workerSrc = '//mozilla.github.io/pdf.js/build/pdf.worker.js';

  var pdfDoc = null;
  var pageNum = 1;
  var pageRendering = false;
  var pageNumPending = null;
  var scale = 1;
  var numi;
  var n;
  var ctx;
  var viewport;
  var canvas0;
  var renderContext;
  var renderTask;
  var pdfDoc;
  var createdom = document.getElementById("canvas");

  PDFJS.getDocument(url).then(function(pdfDoc_) {
    pdfDoc = pdfDoc_;
    document.getElementById('page_count').textContent = pdfDoc.numPages;

    renderPage(pageNum);
  });

  function renderPage(num) {
    pageRendering = true;
    fragment = document.createDocumentFragment();

    for(var i = 1; i < pdfDoc.numPages + 1; i++){
        cv = document.createElement("canvas");
        cv.setAttribute("id","canvas" + i);
        fragment.appendChild(cv);

      pdfDoc.getPage(i).then(function(page) {
          numi = i++;
          n = numi-3;
          canvas0 = document.getElementById("canvas" + n);
          ctx = canvas0.getContext('2d');
          viewport = page.getViewport(scale);
          canvas0.height = viewport.height;
          canvas0.width = viewport.width;

          renderContext = {
            canvasContext: ctx,
            viewport: viewport
          };

          renderTask = page.render(renderContext);

          renderTask.promise.then(function() {
            pageRendering = false;
            if (pageNumPending !== null) {
              renderPage(pageNumPending);
              pageNumPending = null;
            }
          });
          return;
        });

    }
      createdom.appendChild(fragment);

    document.getElementById('page_num').textContent = pageNum;
  }

  function queueRenderPage(num) {
    if (pageRendering) {
      pageNumPending = num;
    } else {
      renderPage(num);
    }
  }

  function onPrevPage() {
    if (pageNum <= 1) {
      return;
    }
    pageNum - 2;
    queueRenderPage(pageNum);
  }
  document.getElementById('prev').addEventListener('click', onPrevPage);

  function onNextPage() {
    if (pageNum >= pdfDoc.numPages) {
      return;
    }
    pageNum + 2;
    queueRenderPage(pageNum);
  }
  document.getElementById('next').addEventListener('click', onNextPage);


})();

少し、力技になってしまっている箇所がありますが、実装できました。