如何设置Google Charts通过getImageURI导出的图片尺寸

getImageURI() 导出的图片尺寸和图表在页面中实际渲染的尺寸完全一致，默认400x200是未指定容器尺寸时的默认渲染大小，可通过以下方案调整：

方法1：初始化时直接指定图表容器尺寸 #

这是最简便的方案，渲染阶段就使用目标导出尺寸，导出的图片自然匹配对应大小：

<!-- 按需设置容器尺寸，示例为800x600 -->
<div id="chart_div" style="width: 800px; height: 600px;"></div>

按常规逻辑初始化渲染图表后，调用getImageURI()得到的就是对应尺寸的图片。

方法2：导出前临时修改图表尺寸（不影响页面展示效果） #

如果不想在页面上展示大尺寸图表，可以在导出前临时重绘为高分辨率尺寸，导出完成后再切回原尺寸，用户不会感知到切换过程：

// 保存原有容器尺寸
const chartDiv = document.getElementById('chart_div');
const originalWidth = chartDiv.offsetWidth;
const originalHeight = chartDiv.offsetHeight;

// 临时设置为目标导出尺寸，示例为1600x1200
chartDiv.style.width = '1600px';
chartDiv.style.height = '1200px';
// 重绘图表
chart.draw(data, options);

// 监听重绘完成事件后执行导出
google.visualization.events.addListener(chart, 'ready', function () {
  const imgUri = chart.getImageURI();
  // 此处编写你的导出处理逻辑（下载/上传等）

  // 导出完成后恢复原尺寸并重绘
  chartDiv.style.width = `${originalWidth}px`;
  chartDiv.style.height = `${originalHeight}px`;
  chart.draw(data, options);
});

注意：如果导出尺寸是页面显示尺寸的多倍（比如2倍高清图），可以同步把图表配置项里的fontSize、lineWidth、pointSize等样式参数按比例放大，避免导出的图中元素过小、文字模糊。

内容的提问来源于stack exchange，提问作者ssebastianoo