Можно ли сохранить диаграмму Google как изображение?

Я делаю приложение, в котором мне нужно будет сохранить диаграмму google как изображение. Все, что я использую, это tomcat, сервлеты и 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>

Ответы

Ответ 1

Похоже, что эта функция была недавно добавлена ¹ как:

chart.getImageURI()

См. документацию .

^{¹ Он, похоже, был добавлен в выпуск от 29 января 2014 года.}

Ответ 2

Пример решения от Riccardo Govoni, как видно на странице проблем графиков Google. Идея состоит в том, чтобы преобразовать 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

Ответ 3

Это то, что я делаю

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

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

если 3kb script слишком много используется http://www.closure-compiler.appspot.com/home

Ответ 4

Самый простой вариант - восстановить статическую версию диаграммы с помощью API Google Chart

Ответ 5

Используйте библиотеку grChartImg. Это кросс-браузерное решение от Джорджа Рисваса. Поддерживает все браузеры, включая более старые версии IE, и предоставляет вам множество автоматических процедур, таких как преобразование диаграммы в изображение, загрузку, отображение диаграммы в диалоговом окне, загрузку ее на сервер и т.д.

Подробнее см. www.chartstoimage.

Я надеюсь помочь вам.

Ответ 6

Сначала загрузите эту библиотеку:

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")

    });
}