c3.jsグラフをpdfとしてエクスポート

Question

私はビルドチャートにc3.jsライブラリを使用しています。そして、c3.jsで作成されたチャートをpdf形式でエクスポートする簡単なソリューションがあるかどうかは疑問でした。

私は角度jsのソリューションを得ましたが、私はjQueryベースのソリューションを探しています。

Answer 1

必要なものは、SVGからPNGへとPNGからPDFへのコンバータです。ここでは、純粋なJS溶液（jQueryを使って動作します）

svg->png

pdf exporter

があなたのページに上記の2つのファイルをインクルードです。

/** 
 
* @param {SVGElement} svg 
 
* @param {Function} callback 
 
* @param {jsPDF} callback.pdf 
 
* */ 
 
function svg_to_pdf(svg, callback) { 
 
    svgAsDataUri(svg, {}, function(svg_uri) { 
 
    var image = document.createElement('img'); 
 

 
    image.src = svg_uri; 
 
    image.onload = function() { 
 
     var canvas = document.createElement('canvas'); 
 
     var context = canvas.getContext('2d'); 
 
     var doc = new jsPDF('portrait', 'pt'); 
 
     var dataUrl; 
 

 
     canvas.width = image.width; 
 
     canvas.height = image.height; 
 
     context.drawImage(image, 0, 0, image.width, image.height); 
 
     dataUrl = canvas.toDataURL('image/jpeg'); 
 
     doc.addImage(dataUrl, 'JPEG', 0, 0, image.width, image.height); 
 

 
     callback(doc); 
 
    } 
 
    }); 
 
} 
 

 
/** 
 
* @param {string} name Name of the file 
 
* @param {string} dataUriString 
 
*/ 
 
function download_pdf(name, dataUriString) { 
 
    var link = document.createElement('a'); 
 
    link.addEventListener('click', function(ev) { 
 
    link.href = dataUriString; 
 
    link.download = name; 
 
    document.body.removeChild(link); 
 
    }, false); 
 
    document.body.appendChild(link); 
 
    link.click(); 
 
}

注：その後、あなたのことを行うために、これらの関数を使用するコードスニペットは、完全にhereからコピーされます。