f
This commit is contained in:
@@ -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();
|
||||||
|
|||||||
Reference in New Issue
Block a user