PDF.js插入图像

顺便说一下，我已经开始使用PDF.js，这是一项出色的工作。PDF.js插入图像

但是现在我想在pdf页面上插入一个图像（从一个画布元素）。这里是我的代码：

var image = myCanvas.getContext('2d').getImageData(0,0,400,300), 
doc = new pdf(); 
doc.setProperties({ 
    title: fileName, 
    author: 'VirtuaLab®', 
    creator: 'pdf.js' 
}); 
doc.addPage(); 
data = doc.output();

但我还没有发现有关在PDF.js页面上插入图像的任何内容。

也许doc.image()或doc.addImage？

来源

2012-08-01 Danilo Valente

声明：我Bytescout

工作，遗憾的是不PDF.js处理图像，这就是为什么我们开发PDF Generator SDK for Javascript（免费的非商业用途），在那里你可以像这样添加图片（从URL或帆布）：

// load image from local file 
pdf.imageLoadFromUrl('image1.jpg'); 
// place this mage at given X, Y coordinates on the page 
pdf.imagePlace(20, 40);

重要的是说，你可以面对图像大小限制BytescoutPDF.js可以消耗的内存来处理大的图像（这个问题是由内存限制的JavaScript造成的）。

但是，如果您只需将徽标图片或小图片插入到生成的PDF中，脚本应该可以正常工作。

UPDATE：中jsPDF最新版本（不要与PDF.js混淆），似乎与影像的工作，看到examples page样品。

来源

2012-08-10 11:36:03

您好@Eugene我们可以添加html（或div）与图像来生成pdf吗？我可能会用plaese分享一些代码示例。提前致谢。 – PlanetHackers 2016-03-09 12:02:01

@PlanetHackers in bytescout不幸的是，对于文本和链接支持简单的html格式化，但不支持图像。图像可以使用.imagePlace（）方法放置 – 2016-03-09 20:01:31

如果我正确理解您的问题，您希望使用<img>而不是<canvas>与pdf.js.

所以这里是我对这个问题的解决方法，将返回的图像作为正常插入到画布中，给画布一个display: none;。

然后使用canvas元素的.toDataURL()方法为您的img获取src。

var canvas = document.getElementById("myCanves"); 
var img = document.getElementById("myImg"); 
img.src = canvas.toDataURL();

我希望这有助于。

来源

2017-05-18 18:31:38 Mendy

PDF.js插入图像

回答

相关问题