使用JSPDF生成PDF时的动态数据截断

时间:2018-10-26 06:44:32

标签: pdf-generation jspdf html2canvas

Data Truncated at bottom of the page

嗨,

数据正在动态生成,我无法为每个页面设置静态高度。 如果您有任何解决方案,请告诉我。

`var pdfContainer = $('#html-2-pdfwrapper')                 html2canvas(quotes,{                     onrendered:功能(画布){

                    //! MAKE YOUR PDF
                    var pdf = new jsPDF('p', 'pt', 'letter');

                    for (var i = 0; i <= quotes.clientHeight / 980; i++) {
                        //! This is all just html2canvas stuff
                        var srcImg = canvas;
                        var sX = 0;
                        var sY = 980 * i; // start 980 pixels down for every new page
                        var sWidth = 900;
                        var sHeight = 980;
                        var dX = 0;
                        var dY = 0;
                        var dWidth = 900;
                        var dHeight = 980;

                        window.onePageCanvas = document.createElement("canvas");
                        onePageCanvas.setAttribute('width', 900);
                        onePageCanvas.setAttribute('height', 1200);
                        var ctx = onePageCanvas.getContext('2d');

                        ctx.clearRect(0, 0, canvas.width, canvas.height);
                        ctx.fillStyle = "#FFFFFF";
                        ctx.fillRect(0, 0, canvas.width, canvas.height);

                        // 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/jpeg", 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('letter', 'pt'); //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, 'JPEG', 20, 40, (width * .62), (height * .62));

                    }
                    //! after the for loop is finished running, we save the pdf.
                    pdf.save('Test.pdf');
                }
            });`

0 个答案:

没有答案