将 GoogleGraph 保存为矢量图像答案

【问题标题】：Save GoogleGraph as Vector Image将 GoogleGraph 保存为矢量图像
【发布时间】：2013-10-21 13:44:20
【问题描述】：

我正在动态创建分析的 PDF 文档。图表等是使用 Google Graph API 创建的。所以我正在做的是将图表更改为图像，然后将它们加载到网页中，然后使用 mpdf (http://www.mpdf1.com/mpdf/index.php) 库将其转换为 PDF。

这是我正在关注的教程：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 Graphs 转换为 pdf，我将非常乐意探索其他选项。

【问题讨论】：

标签： javascript php pdf svg

【解决方案1】：

我认为 var "svg" 包含 SVG。您不需要转换它。所以：

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

【讨论】：