2012-07-02 4 views
11

Sto cercando di utilizzare i grafici di Google per incorporare le immagini dei grafici nelle e-mail. Quindi ogni utente avrà un grafico unico.Google Charts as Image

Possiamo utilizzare l'API e incorporare un URL univoco che renderizzerà i Grafici e fornirà un'immagine al client di posta elettronica.

+0

la funzione di grafici di immagini da google charts funziona a meraviglia, vedere http://datamakessense.com/kpi-emails-with-google-charts-url-parameters – AdrianBR

risposta

4

È possibile generare un URL che renderà un'immagine di un grafico utilizzando Google Chart Wizard. Tuttavia, quel servizio recentemente (aprile credo) perché deprecato. Funziona ancora bene, ma per una soluzione a lungo termine, potrebbe essere necessario trovare un altro metodo.

Modifica

Un altro metodo sarebbe quello di generare l'immagine e salvarla sul server prima di inviare l'e-mail. Puoi farlo avendo una pagina sul tuo server dedicata alla generazione del grafico analizzando un dato slug, e quando il grafico viene caricato invia una richiesta POST con i dati dell'immagine. È possibile accedere ai dati URI utilizzando una tela nascosta (HTML5 è richiesta) e il canvg javascript plugin:

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"); 
+1

qualsiasi altra alternativa? –

7

è possibile ottenere una versione PNG del grafico utilizzando chart.getImageURI() come segue:

deve essere dopo che il grafico è stato disegnato, quindi nell'evento 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); 
1

Un po 'tardi alla festa, ma abbiamo appena costruito https://ChartURL.com per questa esigenza esatto perché nonostante tale questione sarà quasi 3,5 anni, la soluzione migliore là fuori fino ChartURL era il deprecato Google Charts API Immagine :)

Spero che questo aiuti qualcuno fuori!