Можно ли сохранить диаграмму Google в виде изображения? - PullRequest
Новая
       14

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

13 голосов
/ 29 марта 2011

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

Ответы [ 6 ]

12 голосов
/ 25 февраля 2014

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

chart.getImageURI()

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

1 Похоже, что он был добавлен в выпуске 29 января 2014 года.

7 голосов
/ 25 февраля 2012

Пример решения от Риккардо Говони, как видно на странице вопросов в 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

4 голосов
/ 01 января 2015

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

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

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

, если сценарий 3 КБ слишком много, используйте http://www.closure -compiler.appspot.com / home

1 голос
/ 15 мая 2013

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

Для получения дополнительной информации см. www.chartstoimage .

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

1 голос
/ 29 марта 2011

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

0 голосов
/ 19 апреля 2017

Сначала скачайте эту библиотеку:

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

    });
}
...