如何通过Excel JS Add-in API实现簇状柱形+带标记折线的组合图?
可行性说明
完全可行。Excel JavaScript API支持为单个图表内的不同数据系列指定独立的图表类型,因此可以轻松实现簇状柱形图与带标记折线图的组合效果。
示例代码
以下是完整的实现代码,包含数据准备、图表创建、系列类型设置等核心步骤:
async function createCombinationChart() { await Excel.run(async (context) => { // 获取当前活动工作表 const activeSheet = context.workbook.worksheets.getActiveWorksheet(); // 填充示例数据(实际使用时可替换为你的数据区域) activeSheet.getRange("A1:D4").values = [ ["品类", "实际销售额", "同比增长率", "目标达成率"], ["电子设备", 28000, 0.18, 0.92], ["家居用品", 15000, 0.07, 0.78], ["服饰鞋帽", 22000, 0.12, 0.85] ]; // 以销售额数据为基础创建簇状柱形图 const comboChart = activeSheet.charts.add( Excel.ChartType.columnClustered, activeSheet.getRange("A1:B4") ); comboChart.title.text = "销售数据组合分析图"; // 添加增长率系列,并设置为带标记的折线图 const growthRateSeries = comboChart.series.add( "同比增长率", activeSheet.getRange("A2:A4"), activeSheet.getRange("C2:C4") ); growthRateSeries.chartType = Excel.ChartType.lineMarkers; // 自定义折线标记样式(可选) growthRateSeries.marker.style = Excel.MarkerStyle.diamond; growthRateSeries.marker.size = 9; // 可选:将折线系列切换到次坐标轴,避免数值范围差异导致的显示问题 growthRateSeries.axisGroup = Excel.ChartAxisGroup.secondary; await context.sync(); }); }
关键说明
- 先创建基础的簇状柱形图,再通过
chart.series.add()添加新的数据系列 - 使用
series.chartType将指定系列修改为Excel.ChartType.lineMarkers(带标记折线图) - 可以通过
marker属性自定义折线标记的样式和大小 - 如果柱形和折线的数值范围差异较大,建议将折线系列设置到次坐标轴(
axisGroup = Excel.ChartAxisGroup.secondary)
内容的提问来源于stack exchange,提问作者Franek Kuciapa
相关产品推荐
相关产品推荐

