2013-10-21 50 views
0

我正在動態創建分析的PDF文檔。圖表等是使用Google Graph API創建的。所以我正在做的是將圖形變成圖像,然後將它們加載到網頁中,然後使用mpdf(http://www.mpdf1.com/mpdf/index.php)庫將其轉換爲PDF。將GoogleGraph另存爲矢量圖像

這是教程,我followng:http://www.battlehorse.net/page/topics/charts/save_google_charts_as_image.html和我已經糾正代碼:

function getImgData(chartContainer) { 
var chartArea = chartContainer.getElementsByTagName('svg')[0].parentNode; 
var svg = chartArea.innerHTML; 
var doc = chartContainer.ownerDocument; 
var canvas = doc.createElement('canvas'); 
canvas.setAttribute('width', chartArea.offsetWidth); 
canvas.setAttribute('height', chartArea.offsetHeight); 


canvas.setAttribute(
    'style', 
    'position: absolute; ' + 
    'top: ' + (-chartArea.offsetHeight * 2) + 'px;' + 
    'left: ' + (-chartArea.offsetWidth * 2) + 'px;'); 
doc.body.appendChild(canvas); 
canvg(canvas, svg); 
var imgData = canvas.toDataURL("image/png"); 
canvas.parentNode.removeChild(canvas); 
return imgData; 
} 

基於本主題中的建議:Save Google charts as a image

但是,輸出的圖像是PNG格式,我需要它是SVG,我想這可能只是改變這一行的情況:

var imgData = canvas.toDataURL("image/png"); 

到:

var imgData = canvas.toDataURL("image/svg"); 

但是這不是工作,任何人都可以請指點我在正確的方向嗎?或者如果有更好更自由的方式將Google圖表轉換爲PDF,我會很樂意探索其他選項。

回答

2

我會認爲var「svg」包含SVG。你不需要轉換它。所以:

function getSvgData(chartContainer) { 
var chartArea = chartContainer.getElementsByTagName('svg')[0].parentNode; 
var svg = chartArea.innerHTML; 
return svg; 
}