是否可以將谷歌圖表保存爲圖片？

我正在製作一個應用程序，我需要將Google圖表保存爲圖像。我使用的全部是tomcat，servlet和javascript。有沒有辦法將以下生成的圖表保存爲圖像？（請參閱帖子末尾的代碼）。這個想法是，用戶會看到這個圖表，然後可以選擇將其上傳到他的Facebook個人資料。我不確定這是否會以其原生格式上傳到Facebook，或者需要保存爲JPG格式。是否可以將谷歌圖表保存爲圖片？

<html>  
<head> 
<script type="text/javascript" src="https://www.google.com/jsapi"></script> 
<script type="text/javascript"> 
    google.load("visualization", "1", {packages:["corechart"]}); 
    google.setOnLoadCallback(drawChart); 
    function drawChart() { 
    var data = new google.visualization.DataTable(); 

    data.addColumn('string', 'Year'); 
    data.addColumn('number', 'Sales'); 
    data.addRows(4); 
    data.setValue(0, 0, ''+2004); 
    data.setValue(0, 1, 1000); 
    data.setValue(1, 0, '2005'); 
    data.setValue(1, 1, 1170); 
    data.setValue(2, 0, '2006'); 
    data.setValue(2, 1, 860); 
    data.setValue(3, 0, '2007'); 
    data.setValue(3, 1, 1030.5); 

    var chart = new google.visualization.LineChart(document.getElementById('chart_div')); 
    chart.draw(data, {width: 400, height: 240, title: 'Company Performance',hAxis: {title: "X", titleTextStyle: {color: "green"}}}); 
    } 

</script> 
    </head> 

    <body> 
    <div id="chart_div"></div> 
    </body> 
</html>

來源

2011-03-28 Kashif

是你的應用程序集成了Facebook和可以通過API將照片上傳至Facebook帳戶內的事件監聽器？如果沒有，用戶必須使用Facebook上傳來做到這一點。在這種情況下，他們必須右鍵點擊圖表圖像，保存爲，然後上傳到Facebook。 – 2011-03-28 23:21:30

如果您在加載時運行提琴手，則會看到它只是從谷歌加載圖像。讓你的服務器向同一個圖像網址發送http請求將允許你的服務器直接從谷歌下載圖像並做任何它喜歡的圖像。 – 2011-03-28 23:22:50

對於任何人仍在尋找答案，請參閱： https://gist.github.com/1333906 – undsoft 2012-06-21 11:31:05

你簡單的選項是使用再生從裏卡多Govoni的Google Chart API

來源

2011-03-28 23:27:05 RSG

該API已於2012年4月20日棄用。（此答案發布後）。有一個新的圖表API，但不支持靜態圖像。 https://developers.google.com/chart/ – dana 2012-10-01 21:29:26

解決方案案例谷歌圖表的問題頁面上所看到的圖表的靜態圖像版本。這個想法是將SVG轉換爲Canvas元素。

鏈接：

教程：http://www.battlehorse.net/page/topics/charts/save_google_charts_as_image.html

示例頁面：http://www.battlehorse.net/attach/topics/charts/google_charts_to_image.html

來源

2012-02-25 14:03:44 Kosio

不再有效。 :( – 2013-03-24 16:04:16

它看起來像有一個工作版本在這[jsfiddle]（http://jsfiddle.net/SCjm8/1/） – mgilson 2013-09-19 17:08:08

下面是如何設置文件名和擴展名：http://stackoverflow.com/questions/7717851/save-file-javascript-with-file-name – Owen 2013-10-31 13:40:25

使用grChartImg庫。這是來自George Risvas的跨瀏覽器解決方案。支持所有瀏覽器，包括舊版本的IE，併爲您提供許多自動程序，如將圖表轉換爲圖像，下載，顯示圖表到對話框，將其上傳到服務器等。

欲瞭解更多信息，請看www.chartstoimage 。

我希望能幫到你。

來源

2013-05-14 22:14:05 john

它看起來像這樣的特點是最近添加：

chart.getImageURI()

見documentation。

^{它似乎是在2014年1月29日發佈的版本中添加的。}

來源

2014-02-25 19:39:47 mgilson

現在這個消失了嗎？ – Jglstewart 2015-03-12 17:35:51

@Jglstewart - 我當然希望不是......： -/ – mgilson 2015-03-12 17:40:29

它沒有，我的圖表是一個ChartWrapper，它導致了未定義的函數錯誤爲了解決這個問題，我使用了chart.getChart.getImageURI（）; – Jglstewart 2015-03-12 18:05:58

這是我做的

http://danml.com/#/download.html

download(chart.getImageURI(), 'fileName.png', "image/png");

如果3KB腳本是過多的使用http://www.closure-compiler.appspot.com/home

來源

2015-01-01 05:36:30 Oshanz

首先，下載這個庫：

http://danml.com/download.html

以後你剛纔添加圖表

function: 
google.charts.setOnLoadCallback(drawVisualization); 

    function drawVisualization() { 

var chart = new google.visualization.ComboChart(document.getElementById('chart_tickets')); 
    google.visualization.events.addListener(chart, 'ready', function() { 

    $("#GraphDownloadTickets").click(function() { 
     download(chart.getImageURI(), 'fileName.png', "image/png") 

    }); 
}

來源

2017-04-19 08:53:44

是否可以將谷歌圖表保存爲圖片？

回答

相關問題