如何在Google Sheets中创建X轴为月份的聚类堆叠柱形图?
解决方案:用Google Visualization API在Google Sheets实现聚类堆叠柱形图
我完全理解你在Google Sheets里复现Excel那种聚类堆叠柱形图的痛点——原生图表确实没有直接选项,但借助Google Visualization API + Apps Script完全能搞定。下面是一步步的具体方案:
1. 准备你的数据结构
首先确保表格数据是分组堆叠的格式,示例如下:
| 月份 | 组A-类别1 | 组A-类别2 | 组B-类别1 | 组B-类别2 |
|---|---|---|---|---|
| 1月 | 10 | 20 | 15 | 25 |
| 2月 | 12 | 18 | 17 | 22 |
| 3月 | 15 | 15 | 20 | 18 |
核心逻辑:把每个聚类组的堆叠系列放在相邻列,比如组A的两个类别相邻,组B的两个类别也相邻。
2. 编写Google Apps Script代码
打开你的Google Sheets,点击顶部菜单的扩展 > Apps Script,替换默认代码为以下内容:
// 自定义菜单:打开Sheets时自动加载 function onOpen() { const ui = SpreadsheetApp.getUi(); ui.createMenu('自定义图表工具') .addItem('生成聚类堆叠柱形图', 'showClusteredStackedChart') .addToUi(); } // 生成并显示聚类堆叠柱形图 function showClusteredStackedChart() { // 获取当前活跃工作表的所有数据 const activeSheet = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet(); const sheetData = activeSheet.getDataRange().getValues(); // 构建包含Google Charts的HTML页面 const chartHtml = HtmlService.createHtmlOutput(` <html> <head> <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script> <script type="text/javascript"> // 加载Google Charts核心包 google.charts.load('current', {'packages':['corechart']}); google.charts.setOnLoadCallback(drawClusteredStackedChart); function drawClusteredStackedChart() { // 将表格数据转换为Google Charts可识别的格式 const chartData = google.visualization.arrayToDataTable(${JSON.stringify(sheetData)}); // 配置图表选项:关键是通过series设置堆叠/聚类规则 const chartOptions = { title: '月度聚类堆叠柱形图', width: 900, height: 500, isStacked: true, // 开启堆叠模式 series: { // 组A的两个系列:共用轴0,实现堆叠 0: {targetAxisIndex: 0}, 1: {targetAxisIndex: 0}, // 组B的两个系列:共用轴1,和组A聚类 2: {targetAxisIndex: 1}, 3: {targetAxisIndex: 1} }, hAxis: {title: '月份', titleTextStyle: {color: '#333'}}, vAxis: {minValue: 0, title: '数值'}, legend: {position: 'top', maxLines: 2}, chartArea: {width: '75%', height: '70%'} }; // 初始化并绘制图表 const chart = new google.visualization.ColumnChart(document.getElementById('chartContainer')); chart.draw(chartData, chartOptions); } </script> </head> <body> <div id="chartContainer"></div> </body> </html> `).setWidth(950).setHeight(550); // 在Sheets中弹出对话框显示图表 SpreadsheetApp.getUi().showModalDialog(chartHtml, '月度聚类堆叠柱形图'); }
3. 授权并运行
- 保存脚本(给它起个名字,比如
ClusteredStackedChart)。 - 点击工具栏的运行按钮,首次运行会要求授权,按照提示完成权限验证(这是Google的安全流程,你的数据只会在你的账户内处理)。
- 刷新Google Sheets,顶部会出现新菜单自定义图表工具。
4. 生成图表
点击自定义图表工具 > 生成聚类堆叠柱形图,就会弹出对话框显示你需要的聚类堆叠柱形图了。
自定义调整提示
- 如果你的聚类组更多(比如组C、组D),只需要在
series配置里增加对应的targetAxisIndex即可——相同索引的系列会堆叠,不同索引的会聚类。 - 可以修改
chartOptions里的标题、尺寸、颜色等参数,完全适配你的需求。
内容的提问来源于stack exchange,提问作者Vinay Patel
相关产品推荐
相关产品推荐

