将Canvas内容导出为PDF

Question

我正在使用HTML5 Canvas工作.这一切都很好,除了现在,我可以使用Canvas2image将画布内容导出到PNG.但我想将其导出为PDF.我做了一些研究,我很确定它是可能的......但我似乎无法理解我需要在代码中进行哪些更改才能使其正常工作.我已经读过一个名为pdf.js的插件......但我无法弄清楚如何在我的代码中实现它.

第一部分 :

function showDownloadText() {
        document.getElementById("buttoncontainer").style.display = "none";
        document.getElementById("textdownload").style.display = "block";
    }

    function hideDownloadText() {
        document.getElementById("buttoncontainer").style.display = "block";
        document.getElementById("textdownload").style.display = "none";
    }

    function convertCanvas(strType) {
        if (strType == "PNG")
            var oImg = Canvas2Image.saveAsPNG(oCanvas, true);
        if (strType == "BMP")
            var oImg = Canvas2Image.saveAsBMP(oCanvas, true);
        if (strType == "JPEG")
            var oImg = Canvas2Image.saveAsJPEG(oCanvas, true);

        if (!oImg) {
            alert("Sorry, this browser is not capable of saving " + strType + " files!");
            return false;
        }

        oImg.id = "canvasimage";

        oImg.style.border = oCanvas.style.border;
        oCanvas.parentNode.replaceChild(oImg, oCanvas);

        showDownloadText();
    }

并且JS保存图像:

    document.getElementById("convertpngbtn").onclick = function() {
        convertCanvas("PNG");
    }

    document.getElementById("resetbtn").onclick = function() {
        var oImg = document.getElementById("canvasimage");
        oImg.parentNode.replaceChild(oCanvas, oImg);

        hideDownloadText();
    }

}

Answer 1

看看这个链接：

• http://www.codeproject.com/Questions/385045/export-html5-webpage-include-canvas-to-pdf
• http://badassjs.com/post/708922912/pdf-js-create-pdfs-in-javascript

它很可能会完成您需要的工作