The front end is inverted to pdf, and the pictures of the original page cannot be exported together.

convertCanvasToImage () {

        var target = document.getElementById("app");
        target.style.background = "-sharpFFFFFF";

        html2canvas(target, {
            onrendered:function(canvas) {
                var contentWidth = canvas.width;
                var contentHeight = canvas.height;

                //pdfhtmlcanvas;
                var pageHeight = contentWidth / 592.28 * 841.89;
                //pdfhtml
                var leftHeight = contentHeight;
                //
                var position = 0;
                //a4[595.28,841.89]htmlcanvaspdf
                var imgWidth = 595.28;
                var imgHeight = 592.28/contentWidth * contentHeight;

                var pageData = canvas.toDataURL("image/jpeg", 1.0);

                var pdf = new jsPDF("", "pt", "a4");

                //htmlpdf(841.89)
                //pdf
                if (leftHeight < pageHeight) {
                pdf.addImage(pageData, "JPEG", 0, 0, imgWidth, imgHeight );
                } else {
                    while(leftHeight > 0) {
                        pdf.addImage(pageData, "JPEG", 0, position, imgWidth, imgHeight)
                        leftHeight -= pageHeight;
                        position -= 841.89;
                        //
                        if(leftHeight > 0) {
                        pdf.addPage();
                        }
                    }
                }

                pdf.save("content.pdf");
            }
        })
    } 
    pdf
May.12,2022

does not have a picture, either because the picture link is cross-domain or because of the style.
if it is cross-domain, you need to change the image link to base64
if it is css, then adjust it slowly before generating pdf.

Menu