getImageURI() gibt eine große URL zurück, die nicht im Browser geöffnet wird

Question

Ich konvertiere gerade mein Google-Säulendiagramm in ein PNG und dann die URL mit chart_div.innerHTML, füge es in den Browser (Firefox) ein.

Mein Fehler ist: 413. Das ist ein Fehler. Ihr Kunde hat eine Anfrage ausgegeben, die zu groß war.

Gibt es eine Möglichkeit, die Größe der URL zu reduzieren? oder irgendeine mögliche Lösung um es herum? Mein Ziel ist es, alle meine 4 Diagramme in PNGs zu konvertieren und jedes oder mindestens 1 zu drucken.

Answer 1

das Bild in einem neuen Fenster senden,
dies wird Ihnen auf der rechten Maustaste und die als, Druck speichern, etc ...

window.open(chart.getImageURI(), '_blank'); 

die oben schafft ein „Pop-up“ und kann sein blockiert,
Sie auch die Position der aktuellen Seite ändern können ...

location.href = chart.getImageURI(); 

für ein Beispiel folgende Geige sehen ...

https://jsfiddle.net/7qtuhwaw/

EDIT

eine Option für Chrom einen Download-Link zu erstellen ist,
siehe folgende Arbeits Schnipsel ...

google.charts.load('current', { 
 
    callback: function() { 
 
    var data = new google.visualization.DataTable(); 
 
    data.addColumn('date', 'Date'); 
 
    data.addColumn('number', '2015'); 
 
    data.addColumn('number', '2016'); 
 
    data.addRows([ 
 
     [new Date('01/01/2016'), 200, 210], 
 
     [new Date('02/01/2016'), 190, 220], 
 
     [new Date('03/01/2016'), 205, 200], 
 
     [new Date('04/01/2016'), 220, 230], 
 
     [new Date('05/01/2016'), 212, 210], 
 
     [new Date('06/01/2016'), 185, 193], 
 
     [new Date('07/01/2016'), 196, 207] 
 
    ]); 
 

 
    var chart = new google.visualization.LineChart(document.getElementById('chart_div')); 
 

 
    google.visualization.events.addListener(chart, 'ready', function() { 
 
     downloadLink = document.createElement('a'); 
 
     downloadLink.href = chart.getImageURI(); 
 
     downloadLink.download = 'chart.png'; 
 
     downloadLink.click(); 
 
    }); 
 

 
    chart.draw(data, { 
 
     hAxis: { 
 
     format: 'MMM' 
 
     }, 
 
     height: 400 
 
    }); 
 
    }, 
 
    packages: ['corechart'] 
 
});

<script src="https://www.gstatic.com/charts/loader.js"></script> 
 
<div id="chart_div"></div> 
 
<div id="image_div"></div>

Answer 2

Beispiellösung von Google Developers, wie auf der Ausgabenseite von Google Charts zu sehen.

Links:

Tutorial: https://developers.google.com/chart/interactive/docs/printing

Answer 3

Sofern Sie Zugriff auf Google-Servern haben, müssen Sie die Charts in Stücke greifen. HTTP 413 bedeutet, dass der Server declined your request, weil es einfach zu groß ist. Versuchen Sie, Ihr Diagramm in mehrere Diagramme aufzuteilen und dann entweder lokal wieder zusammenzusetzen oder nur die Abschnitte anzuzeigen.