Open dshakya opened 1 month ago
dalao,怎么开启分页呀
function handleClick() { deviceReportsLazy.value = true const exprtCanvas = exportMe.value domToPng(exprtCanvas, {}).then(canvas => { const img = new Image() img.src = canvas let contentWidth, contentHeight img.onload = function () { contentWidth = img.width contentHeight = img.height const pageHeight = (contentWidth / 595.28) 1000 let leftHeight = contentHeight let position = 0 const imgWidth = 555.28 const imgHeight = (555.28 / contentWidth) contentHeight const pdf = new jsPDF('', 'pt', 'a4', true) if (leftHeight < pageHeight) { pdf.addImage(canvas, 'JPEG', 20, 0, imgWidth, imgHeight) } else { while (leftHeight > 0) { pdf.addImage(canvas, 'JPEG', 20, position, imgWidth, imgHeight) leftHeight -= pageHeight position -= 841.89 if (leftHeight > 0) { pdf.addPage() } } } pdf.save(${t('health.reportName')}.pdf) ElNotification({ title: t('common.form.tip'), message: t('common.text.success'), type: 'success', duration: 2000 }) deviceReportsLazy.value = false } }) }
我是这样写的,但是内容会被截断,有没有办法可以使动态的div容器不被截断
I create a Nodelist of sections in html by using querySelectAll and then iterate through it to generate image. I then create pages depending on the element height, finally saving it as PDF. It works well but it takes a long time. I used this method instead of the html plugin because it cut off the images and text between pages and I couldn't find documentation on how to use manual pagination with the html plugin. I can just turn the automatic pagination off but then the layout goes everywhere.
Because canvas2html creates iFrame in the DOM while converting to PDF, it takes a long time as I have about 20 sections to convert to image, add to doc and then save it. Is there a way to improve this workflow for faster rendering of the pdf? I couldn't use the web worker as there is DOM manipulation and it freezes the main UI thread while generating the PDF. I kind of got away by using the setTimeout to show the indeterminate progress bar but still very slow.
Is there a way to handle pagination a bit better using the manual way or while using the html plugin?