I required stacked bar chart as below:
我的stackblitz链接:stackblitz在这个参考代码中,我想存档左端部分边界半径。图例还显示了条形图的每个块及其位置“顶部”。
41zrol4v1#
对于边界半径,如文档https://www.chartjs.org/docs/latest/charts/bar.html#borderradius中所述,对于堆叠条形,如果边界半径以数字形式提供,则它将应用于位于堆叠边缘的条形。因此,您应该按对象设置边界半径(同时注意borderSkipped选项),如下所示(使用您的示例):
datasets: [ { data: [30], label: '88000 SGD', backgroundColor: 'red', //'#EDFFFA', borderWidth: 1, borderColor: '#EDFFFA', borderSkipped: 'end', borderRadius: {topLeft: 15, bottomLeft: 15}, }, { data: [30], label: '240,000 SGD', backgroundColor: '#06A6A6', borderWidth: 1, borderColor: '#06A6A6', borderSkipped: 'start', borderRadius: {topRight: 15, bottomRight: 15}, }, ],
对于图例,你不能像图中所示的那样开箱即用。可能你需要一个插件。
1条答案
按热度按时间41zrol4v1#
对于边界半径,如文档https://www.chartjs.org/docs/latest/charts/bar.html#borderradius中所述,对于堆叠条形,如果边界半径以数字形式提供,则它将应用于位于堆叠边缘的条形。
因此,您应该按对象设置边界半径(同时注意borderSkipped选项),如下所示(使用您的示例):
对于图例,你不能像图中所示的那样开箱即用。可能你需要一个插件。