我正在尝试使用jspdf在pdf中获取表格(html)的图像。
我指的是url / post。 http://embed.plnkr.co/scZ5u0/
下面是代码:
var quotes = document.getElementById('__xmlview0--captureTable');
html2canvas(quotes, {
onrendered: function (canvas) {
for (var i = 0; i <= quotes.clientHeight / 980; i++) {
//! This is all just html2canvas stuff
var srcImg = canvas;
var sX = 0;
var sY = 1100 * i; // start 1100 pixels down for every new page
var sWidth = 900;
var sHeight = 1100;
var dX = 0;
var dY = 0;
var dWidth = 900;
var dHeight = 1100;
window.onePageCanvas = document.createElement("canvas");
onePageCanvas.setAttribute('width', 900);
onePageCanvas.setAttribute('height', 1100);
var ctx = onePageCanvas.getContext('2d');
// details on this usage of this function:
// https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Using_images#Slicing
ctx.drawImage(srcImg, sX, sY, sWidth, sHeight, dX, dY, dWidth, dHeight);
// document.body.appendChild(canvas);
var canvasDataURL = onePageCanvas.toDataURL("image/png", 1.0);
var width = onePageCanvas.width;
var height = onePageCanvas.clientHeight;
//! If we're on anything other than the first page,
// add another page
if (i > 0) {
pdf.addPage(612, 791); //8.5" x 11" in pts (in*72)
}
//! now we declare that we're working on that page
pdf.setPage(i + 1);
//! now we add content to that page!
pdf.addImage(canvasDataURL, 'PNG', 20, 40, (width * .62), (height * .62));
}
}
})
pdf.save('capture.pdf');
仅下载空白pdf文件。 任何对此的建议,将不胜感激。
已附上,是从开发人员工具中获取的运行时变量的屏幕截图。