ApexCharts堆叠柱状图顶部边框设置异常问题求助

要实现每个堆叠柱状图的顶部整体加圆角（而非每个分段或仅单个数据集生效），你需要放弃全局的borderRadiusWhenStacked配置，改为针对每个堆叠组的最后一个系列单独设置顶部圆角：

步骤1：全局禁用默认圆角 #

在图表的plotOptions.bar中设置全局borderRadius: 0，避免所有堆叠分段都带上圆角：

plotOptions: {
  bar: {
    stacked: true,
    borderRadius: 0 // 全局禁用默认圆角
  }
}

步骤2：给每个堆叠组的最后一个系列配置顶部圆角 #

针对每个堆叠组（通过stack字段分组）的最后一个系列，单独设置仅顶部两个角的圆角：

series: [
  {
    name: '基础数据1',
    data: [40, 35, 50],
    stack: '组A'
  },
  {
    name: '叠加数据1',
    data: [20, 25, 15],
    stack: '组A',
    // 仅顶部左右角加圆角
    borderRadius: {
      topLeft: 6,
      topRight: 6,
      bottomLeft: 0,
      bottomRight: 0
    }
  },
  {
    name: '基础数据2',
    data: [30, 40, 35],
    stack: '组B'
  },
  {
    name: '叠加数据2',
    data: [15, 20, 25],
    stack: '组B',
    borderRadius: {
      topLeft: 6,
      topRight: 6,
      bottomLeft: 0,
      bottomRight: 0
    }
  }
]

为什么之前的配置无效？ #

• 直接设置全局borderRadius: 6会让所有堆叠分段都带上圆角，不符合需求；
• borderRadiusWhenStacked: 'last'的逻辑是整个图表的最后一个系列生效，而非每个堆叠组的最后一个系列，因此只会给单个数据集加上圆角。

通过上述方式，每个堆叠组的顶部（即组内最后一个系列的顶部）会统一显示圆角，其余分段保持直角，完全匹配预期效果。

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