Google Charts as Image

Question

我正在嘗試使用Google圖表在電子郵件中嵌入圖表圖像。所以每個用戶將有一個獨特的圖形。

我們可以使用API​​並嵌入一個唯一的URL來呈現圖表並將圖像傳遞給電子郵件客戶端。

Answer 1

可以使用Google Chart Wizard生成將呈現圖表圖像的url。但是，最近（4月我相信）這項服務因爲已被棄用。它仍然可以正常工作，但對於長期解決方案，您可能需要提出另一種方法。

編輯

另一種方法是生成圖像和發送電子郵件之前將其保存到您的服務器。您可以通過讓服務器上的頁面專用於通過解析給定的slug來生成圖表，以及何時加載圖表來發送包含圖像數據的POST請求。您可以通過使用一個隱藏的畫布上訪問數據URI（HTML5是必需的）和canvg JavaScript的插件：

chart_area = document.getElementById("chart_div").getElementsByTagName('iframe')[0].contentDocument.getElementById("chartArea"); 
svg = chart_area.innerHTML; 
canvas = document.getElementById("hidden_canvas"); 
canvas.setAttribute('width', chart_area.offsetWidth); 
canvas.setAttribute('height', chart_area.offsetHeight); 

canvg(canvas, svg); 
image_data_uri = canvas.toDataURL("image/png"); 

Answer 2

你可以使用chart.getImageURI()圖表的PNG版本類似以下內容：

需要被圖表繪製完成後，所以在ready事件中！

var my_div = document.getElementById('my_div'); 
var my_chart = new google.visualization.ChartType(chart_div); 

google.visualization.events.addListener(my_chart, 'ready', function() { 
    my_div.innerHTML = '<img src="' + chart.getImageURI() + '">'; 
}); 

my_chart.draw(data); 

Answer 3

有點遲到了，但我們剛剛建立https://ChartURL.com這個確切的需要，因爲儘管這個問題是近35歲，最好的解決辦法在那裏，直到ChartURL是棄用谷歌圖片圖表API :)

希望這可以幫助別人！