以 PDF 格式下载图形和表格

Question

我有一个 D3 图表和一个引导表。我想下载 HTMl 页面上的图形和表格。我找到了一些答案，但它们适用于表格下载或图形下载。我想要一个相同的组合PDF。我尝试使用 jspdf，但我被卡住了。

下面是 jsfiddle 的链接。

http://jsfiddle.net/xzZ7n/3301/

function demoFromHTML() {
    var pdf = new jsPDF('p', 'pt', 'letter');
    // source can be HTML-formatted string, or a reference
    // to an actual DOM element from which the text will be scraped.
    source = $('#customers')[0];

    // we support special element handlers. Register them with jQuery-style 
    // ID selector for either ID or node name. ("#iAmID", "div", "span" etc.)
    // There is no support for any other type of selectors 
    // (class, of compound) at this time.
    specialElementHandlers = {
        // element with id of "bypass" - jQuery style selector
        '#bypassme': function (element, renderer) {
            // true = "handled elsewhere, bypass text extraction"
            return true
        }
    };
    margins = {
        top: 80,
        bottom: 60,
        left: 40,
        width: 522
    };
    // all coords and widths are in jsPDF instance's declared units
    // 'inches' in this case
    pdf.fromHTML(
    source, // HTML string or DOM elem ref.
    margins.left, // x coord
    margins.top, { // y coord
        'width': margins.width, // max width of content on PDF
        'elementHandlers': specialElementHandlers
    },

    function (dispose) {
        // dispose: object with X, Y of the last line add to the PDF 
        //          this allow the insertion of new lines after html
        pdf.save('Test.pdf');
    }, margins);
}

后端在 Spring MVC 中。 JQuery 或 JAVA 中的下载功能都很好。 任何帮助将不胜感激。

Answer 1

因此，出于好奇并经历了很多麻烦，我不完全确定 jsPDF 是否最可靠。首先，使用 d3.js 将您的图形呈现为 SVG，因此您最好的选择是将 SVG 转换为 PDF。我发现了这个issue，似乎fromHTML 仍然是一种非常新的方法（它甚至不在内部文档中......）。

他们确实提到他们支持addSVG 方法，但我发现也可能支持not be as ideal as you would like。听起来还是有一些问题，you aren't alone in asking about SVG for this library。

看了一圈后，我认为answer 总结得最好——结帐PDFKit 它为您提供了一种将 SVG 呈现为 PDF 的方法，尽管在查看了文档之后，它们似乎只允许您绘制？它没有显示仅将 SVG 添加到 PDF 文档的方法。答案还提到了一个用于 jsPDF 的 svgToPDF 插件，但我看了显然是这个 was merged a while ago 所以我不确定它实际上是一个插件还是已经内置。

希望这能提供更多见解。我自己对这个问题很好奇。如果我找到更好的信息，我会更新这个答案。