javascript - 是否可以使用图表内置方法将谷歌注释图表转换为 pdf/图像

Question

我尝试使用 getImageURI 方法提取图像但没有运气。

下面是我的代码：

var chart = new google.visualization.AnnotationChart(document.getElementById('temperature_chart'));

google.visualization.events.addListener(chart, 'ready', function () {
    var imgUri = chart.getImageURI();
    document.getElementById('chartImg').src = imgUri;
});

chart.draw(data, options);

Answer 1

我不知道 PDF 但图像它是可能的：

<script type="text/javascript" src="http://canvg.github.io/canvg/rgbcolor.js"></script> 
<script type="text/javascript" src="http://canvg.github.io/canvg/StackBlur.js"></script>
<script type="text/javascript" src="http://canvg.github.io/canvg/canvg.js"></script> 



 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;
  }

document.body.addEventListener("load", function() {

        saveAsImg( document.getElementById("pie_div")); // or your ID

    }, false );

有关更多信息，请参阅此链接：将 Google 图表另存为图像 http://www.battlehorse.net/page/topics/charts/save_google_charts_as_image.html https://github.com/google/google-visualization-issues/issues/ 731