javascript - 如何在 pdf 画布上绘制来自 JSON 对象的数据？

Question

以下是参考代码。使用 pdf.js 在画布上渲染 pdf 文件。如何在这个 pdf 画布上绘制数据？这个 pdf 画布与图像和 svg 文件不同，这很明显，但从未找到任何关于 pdf 画布的文档。

function pdfCanvas(scale){    
    PDFJS.getDocument('gkhead.pdf').then(function(pdf) {
      // Using promise to fetch the page
      pdf.getPage(1).then(function(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.height = 800;
        //canvas.width = viewport.width;
            canvas.width = 800;


        //
        // Render PDF page into canvas context
        //
        var renderContext = {
          canvasContext: context,
          viewport: viewport
        };


        page.render(renderContext);


      });
    });
}

Answer 1

看起来您只是在使用普通的 html 画布。尝试查看有关如何使用画布的这些资源。http://joshondesign.com/p/books/canvasdeepdive/toc.html和https://developer.mozilla.org/en-US/docs/HTML/Canvas

我没有使用 PDFJS，但给定您的示例代码，我假设您在画布对象中所做的任何绘图或图形都会显示在您的 pdf 中。