我正在致力于动态创建 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,我将非常乐意探索其他选项。
最佳答案
我认为 var“svg”包含 SVG。您不需要转换它。所以:
function getSvgData(chartContainer) {
var chartArea = chartContainer.getElementsByTagName('svg')[0].parentNode;
var svg = chartArea.innerHTML;
return svg;
}
关于javascript - 将 GoogleGraph 保存为矢量图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19496267/