Render Svg to Pdf bằng cách sử dụng jspdf

Question

Tôi gặp sự cố khi hiển thị phần tử svg thành pdf bằng cách sử dụng jspdf. Iam sử dụng plugin https://github.com/CBiX/svgToPdf.js/ để thực hiện việc này.

Dưới đây là mã của tôi

// I recommend to keep the svg visible as a preview 
var tmp = document.getElementById("chartContainer"); 
var svgDoc = tmp.getElementsByTagName("svg")[0]; 
var pdf = new jsPDF('p', 'pt', 'a4'); 
svgElementToPdf(svgDoc, pdf, { 
scale: 72/96, // this is the ratio of px to pt units 
removeInvalid: false // this removes elements that could not be translated to pdf from the source  svg 
}); 
pdf.output('datauri'); // use output() to get the jsPDF buffer 

Nó được generarting pdf trống. Vui lòng giúp

Answer 1

Bạn có thể làm điều đó bằng cách sử dụng canvg.

Bước 1: Nhận "SVG" mã đánh dấu từ DOM

var svg = document.getElementById('svg-container').innerHTML; 

    if (svg) 
    svg = svg.replace(/\r?\n|\r/g, '').trim(); 

Bước 2: Sử dụng canvg để tạo vải từ svg.

var canvas = document.createElement('canvas'); 
    canvg(canvas, svg); 

Bước 3: Tạo hình ảnh từ vải sử dụng .toDataURL()

var imgData = canvas.toDataURL('image/png'); 
    // Generate PDF 
    var doc = new jsPDF('p', 'pt', 'a4'); 
    doc.addImage(imgData, 'PNG', 40, 40, 75, 75); 
    doc.save('test.pdf'); 

Kiểm tra demo đây http://jsfiddle.net/Purushoth/hvs91vpq/193/

Canvg Repo: https://github.com/gabelerner/canvg