文章/答案/技术大牛

发布

社区首页 >问答首页 >jsPDF + rasterizeHTML不工作？

问jsPDF + rasterizeHTML不工作？
EN

Stack Overflow用户

提问于 2016-08-11 22:51:34

回答 1查看 2.4K关注 0票数 7

jsPDF的addHTML需要html2canvas.js或rasterizeHTML.js。

我想使用rasterizeHTML.js，但它不起作用。在网上找不到任何例子。

与html2canvas.js**:**一起工作的

html

<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.2.61/jspdf.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.min.js"></script>


<body>
    <p id="to-pdf">HTML content...</p>
</body>

var pdf = new jsPDF('p','pt','a4');
pdf.addHTML(document.body,function() {
    pdf.save('web.pdf');
});

不使用rasterizeHTML.js 的(什么都没有发生；没有错误)：

html

<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.2.61/jspdf.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/rasterizehtml/1.2.2/rasterizeHTML.allinone.js"></script>


<body>
    <p id="to-pdf">HTML content...</p>
</body>

var pdf = new jsPDF('p','pt','a4');
pdf.addHTML(document.body,function() {
    pdf.save('web.pdf');
});

我遗漏了什么？

jspdf

javascript

回答 1

Stack Overflow用户

发布于 2019-12-20 05:37:52

最近，我遇到了同样的问题，并设法从不同的来源拼凑了一个工作示例。

基本HTML

<div id="canvas" width="100%">
    <table class='CSSTableGenerator'>
        <tr>
            <td>Item</td>
            <td>Cost</td>
            <td>Description</td>
            <td>Available</td>
        </tr>
        <tr>
            <td>Milk</td>
            <td>$1.00</td>
            <td>Cow puss</td>
            <td>Out Of Stock</td>
        </tr>
        <tr>
            <td>Milk</td>
            <td>$1.00</td>
            <td>white stuff</td>
            <td>Out Of Stock</td>
        </tr>
    </table>
</div>
<button id="download">Create PDF</button>

$(document).ready(function () {
    $('#download').click(function () {
        html2canvas(document.getElementById('canvas'), {
            onrendered: function (canvas) {
                var imgData = canvas.toDataURL('image/png');
                var doc = new jsPDF('p', 'mm');
                doc.addImage(imgData, 'PNG', 10, 10);
                doc.save('download.pdf');
            }
        });
    });
});

http://jsfiddle.net/andyg2/mtLqparw/

资源

https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.5.3/jspdf.debug.js

https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.js

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/38907272

复制

相似问题

问jsPDF + rasterizeHTML不工作？
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jsPDF + rasterizeHTML不工作？EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jsPDF + rasterizeHTML不工作？
EN