Chart.js 使用ChartJs时条形图未堆叠
我正在尝试使用chartJs创建一个堆叠条形图(垂直或水平)。在遵循了他们的文档并尝试了各种解决方案之后,我仍然无法获得要叠加的值Chart.js 使用ChartJs时条形图未堆叠,chart.js,Chart.js,我正在尝试使用chartJs创建一个堆叠条形图(垂直或水平)。在遵循了他们的文档并尝试了各种解决方案之后,我仍然无法获得要叠加的值 const ctx = document.getElementById('chart-canvas').getContext('2d'); const chartCanvas = () => { const chart = new Chart(ctx, { type: 'bar', // The data for our datase
const ctx = document.getElementById('chart-canvas').getContext('2d');
const chartCanvas = () => {
const chart = new Chart(ctx, {
type: 'bar',
// The data for our dataset
data: {
labels: ['a', 'b', 'c'],
datasets: [{
label: 'some title here',
data: [49999,20000,35000],
backgroundColor: ['rgba(255, 99, 132, .5)','rgba(25, 99, 132, .5)','rgba(255, 9, 12, .5)'],
borderColor: ['rgb(255, 99, 132)','rgb(25, 99, 132)','rgb(255, 9, 12)'],
}]
},
// Configuration options go here
options: {
scales: {
xAxes: [{ stacked: true }],
yAxes: [{ stacked: true }]
},
legend: {
display: false,
},
maintainAspectRatio: false,
}
});
}
chartCanvas()
我创造了一把小提琴
感谢您提供有关我哪里出错的任何指导仅当您使用多个数据集时,堆叠选项才起作用。您可以将每个堆叠的值放在单独的数据集中,以便对它们进行堆叠
const ctx = document.getElementById('chart-canvas').getContext('2d');
const chartCanvas = () => {
const chart = new Chart(ctx, {
type: 'bar',
// The data for our dataset
data: {
labels: ['First Data'],
datasets: [
{
label: 'a',
data: [49999],
backgroundColor: ['rgba(255, 99, 132'],
borderColor: ['rgb(255, 99, 132)'],
},
{
label: 'b',
data: [20000],
backgroundColor: ['rgba(25, 99, 132, .5)'],
borderColor: ['rgb(25, 99, 132)'],
},
{
label: 'c',
data: [35000],
backgroundColor: ['rgba(255, 9, 12, .5)'],
borderColor: ['rgb(255, 9, 12)'],
}
]
},
// Configuration options go here
options: {
scales: {
xAxes: [{
stacked: true
}],
yAxes: [{
stacked: true
}]
},
legend: {
display: false,
},
maintainAspectRatio: false,
}
});
}
chartCanvas()