getImageURI（）返回一个不会在浏览器中打开的大url [英] getImageURI() returning a big url that won't open in browser

问题描述

我目前正在将我的google专栏图转换为png，然后使用 chart_div.innerHTML 获取网址，并将其粘贴到浏览器（Firefox）中。

我的错误是：413.这是一个错误。您的客户发出的请求太大

有什么方法可以减少url的大小？或任何可能的解决方案？我的目标是能够将所有4个图表转换为PNG并打印每个图表，或至少1个。 发送发送图像到一个新的窗口，

这将允许您右键单击并保存为，打印等...

  window.open（chart.getImageURI（），'_blank'）; 
  

上述操作会创建一个弹出窗口并可能被阻止，

您也可以更改当前页面的位置...

  location.href = chart.getImageURI（）; 
  

请看下面的例子...

https://jsfiddle.net/7qtuhwaw/

编辑

chrome的选项是创建下载链接，

请参阅以下工作片段...

  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]，[新日期（'04 / 01/2016'），220,230]， [新日期（'05 / 01/2016'），212,210]，[新日期（'06 / 01/2016'），185,193]，[新日期（'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']}）;   
 

I'm currently converting my google column chart into a png, and then getting the url using chart_div.innerHTML, paste it into browser (Firefox).

My error is : 413. That’s an error. Your client issued a request that was too large

Is there any way to reduce the size of the url ? or any possible solution around it ? my goal is to be able to convert all of my 4 charts to pngs and print each, or at least 1.

解决方案

send the image to a new window,
this will allow you to right click and save as, print, etc...

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

the above creates a "pop-up" and may be blocked,
you can also change the location of the current page...

location.href = chart.getImageURI();

see following fiddle for an example...

https://jsfiddle.net/7qtuhwaw/

EDIT

an option for chrome is to create a download link,
see following working snippet...

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>

这篇关于getImageURI（）返回一个不会在浏览器中打开的大url的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！