chart.js重叠的堆栈图

8hhllhi2 于 2022-11-23 发布在 Chart.js

关注(0)|答案(3)|浏览(153)

我正在创建一个堆叠条形图，但我需要它不仅仅是把两个值加在一起并显示出来。
例如：stackgraph
此图表应显示“目标”百分比和实际百分比。因此，如果该列的目标值为70，实际值为30，则将显示0-30之间的实际数字颜色，然后继续显示30-70之间的目标颜色。
有没有办法让它们像这样重叠，而不是总共100个？

chart.js

来源：https://stackoverflow.com/questions/50881882/chart-js-stacked-graph-that-overlaps

3条答案

按热度按时间

rqenqsqc1#

您必须将这些参数添加到代码中-为X轴启用堆叠，为Y轴禁用堆叠：

xAxes: [{ stacked: true }],
  yAxes: [{
    stacked: false,
    ticks: {
      beginAtZero: true,
    },
  }]

赞(0）回复(0）举报 2022-11-23

f45qwnt82#

没关系，我找到答案了。

options: {
              scales: {
                xAxes: [{ stacked: true }],
                yAxes: [{
                        ticks: {
                            beginAtZero:true
                        },
                        stacked: false
                }]
              }
            }

只需将xAxes stacked设置为true，将yAxes设置为false即可

赞(0）回复(0）举报 2022-11-23

kt06eoxx3#

scales: {
  xAxes: [{
      stacked: true
  }],
  yAxes: [{
      stacked: false,
      ticks:{
          suggestedMax:50,
          suggestedMin:1,
          beginAtZero:true,
          max:100,
          autoSkip:true,
          lineHeight:2
      }
  }]
}

赞(0）回复(0）举报 2022-11-23

我来回答

chart.js重叠的堆栈图

3条答案

相关问题

热门标签

最新问答