This commit is contained in:
2026-03-11 15:00:25 +08:00
parent 8441e66e93
commit 03cb6fd92b

View File

@@ -2213,102 +2213,122 @@
requestAnimationFrame(function () { requestAnimationFrame(function () {
requestAnimationFrame(function () { requestAnimationFrame(function () {
try { try {
html2canvas(pageEl, { (function () {
scale: 1.5, var scale = 1.25;
useCORS: true, var pdf = new jspdf.jsPDF("p", "mm", "a4");
allowTaint: false, var pageWidthMm = pdf.internal.pageSize.getWidth();
backgroundColor: "#ffffff", var pageHeightMm = pdf.internal.pageSize.getHeight();
scrollX: 0,
scrollY: 0, // 以元素宽度为基准,计算每一页对应的像素高度(避免生成超长大图导致 jsPDF 白页)
windowWidth: pageEl.scrollWidth, var targetWidthPx = Math.max(
windowHeight: pageEl.scrollHeight, 1,
onclone: function (clonedDoc, node) { Math.floor(pageEl.scrollWidth),
var body = clonedDoc.body; );
if (body) { var pageHeightPx = Math.max(
body.style.backgroundColor = "#ffffff"; 1,
body.style.overflow = "visible"; Math.floor((targetWidthPx * pageHeightMm) / pageWidthMm),
} );
var clonePage = clonedDoc.querySelector(".page"); var totalHeightPx = Math.max(
if (clonePage) { 1,
clonePage.style.overflow = "visible"; Math.floor(pageEl.scrollHeight),
clonePage.style.backgroundColor = "#ffffff"; );
}
}, var offsetY = 0;
}) var pageIndex = 0;
.then(function (canvas) {
if (!canvas.width || !canvas.height) { function renderSlice() {
console.error("截图为空,宽或高为 0"); var sliceHeight = Math.min(
pageHeightPx,
totalHeightPx - offsetY,
);
if (sliceHeight <= 0) {
// 结束,保存
var fileName = "企业全景报告.pdf";
if (
reportData &&
reportData.entName &&
typeof reportData.entName === "string"
) {
fileName =
reportData.entName +
"_企业全景报告.pdf";
}
pdf.save(fileName);
restoreBtn(); restoreBtn();
return; return;
} }
// 调试:确认截图是否全白/是否有内容
try { html2canvas(pageEl, {
var ctx2d = canvas.getContext("2d"); scale: scale,
if (ctx2d) { useCORS: true,
var p = ctx2d.getImageData(0, 0, 1, 1).data; allowTaint: false,
console.info( backgroundColor: "#ffffff",
"PDF截图信息", x: 0,
{ y: offsetY,
w: canvas.width, width: targetWidthPx,
h: canvas.height, height: sliceHeight,
firstPixel: Array.prototype.slice.call(p), scrollX: 0,
}, scrollY: 0,
windowWidth: targetWidthPx,
windowHeight: sliceHeight,
onclone: function (clonedDoc) {
var body = clonedDoc.body;
if (body) {
body.style.backgroundColor = "#ffffff";
body.style.overflow = "visible";
}
var clonePage = clonedDoc.querySelector(".page");
if (clonePage) {
clonePage.style.overflow = "visible";
clonePage.style.backgroundColor = "#ffffff";
}
},
})
.then(function (canvas) {
if (!canvas.width || !canvas.height) {
console.error("分片截图为空,宽或高为 0", {
offsetY: offsetY,
sliceHeight: sliceHeight,
});
restoreBtn();
return;
}
// 调试:输出每页分片信息
console.info("PDF分片截图信息", {
page: pageIndex + 1,
w: canvas.width,
h: canvas.height,
offsetY: offsetY,
sliceHeight: sliceHeight,
totalHeightPx: totalHeightPx,
});
var imgData = canvas.toDataURL("image/jpeg", 0.9);
if (pageIndex > 0) pdf.addPage();
pdf.addImage(
imgData,
"JPEG",
0,
0,
pageWidthMm,
pageHeightMm,
); );
}
} catch (e) { pageIndex += 1;
console.warn("读取截图像素失败(可能被跨域资源污染)", e); offsetY += sliceHeight;
}
var imgData = canvas.toDataURL( // 给 UI 一点喘息,避免长任务卡死
"image/jpeg", setTimeout(renderSlice, 0);
0.95, })
); .catch(function (e) {
var pdf = new jspdf.jsPDF("p", "mm", "a4"); console.error("生成 PDF 失败(分片截图阶段)", e);
var pageWidth = pdf.internal.pageSize.getWidth(); restoreBtn();
var pageHeight = pdf.internal.pageSize.getHeight(); });
var imgWidth = pageWidth; }
var imgHeight =
(canvas.height * imgWidth) / canvas.width; renderSlice();
var position = 0; })();
var heightLeft = imgHeight;
pdf.addImage(
imgData,
"JPEG",
0,
position,
imgWidth,
imgHeight,
);
heightLeft -= pageHeight;
while (heightLeft > 0) {
position = heightLeft - imgHeight;
pdf.addPage();
pdf.addImage(
imgData,
"JPEG",
0,
position,
imgWidth,
imgHeight,
);
heightLeft -= pageHeight;
}
var fileName = "企业全景报告.pdf";
if (
reportData &&
reportData.entName &&
typeof reportData.entName === "string"
) {
fileName =
reportData.entName +
"_企业全景报告.pdf";
}
pdf.save(fileName);
restoreBtn();
})
.catch(function (e) {
console.error("生成 PDF 失败", e);
restoreBtn();
});
} catch (e) { } catch (e) {
console.error("触发生成 PDF 失败", e); console.error("触发生成 PDF 失败", e);
restoreBtn(); restoreBtn();