禁用 1 个数据集的堆叠
Disable stacking for 1 dataset
我有下面这张图表
它们堆叠在一起。我在我的选项中使用这个 属性:
scales: {
y: {
stacked: true,
}
},
如何仅对 1 个数据集禁用堆叠?我想禁用棕色数据集的堆叠,以便其他图表填充它。
棕色图表是 3 个小图表的总和。我想停用大棕色图表的堆叠,以便我可以查看我的图表数据是否正确显示。
您可以在数据集中指定堆栈。如果您将所有数据集分配给同一个堆栈,除了您的棕色数据集,您会得到您想要的:
var options = {
type: 'line',
data: {
labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"],
datasets: [{
label: '# of Votes',
data: [12, 19, 3, 5, 2, 3],
borderColor: 'pink',
stack: 'stack2'
},
{
label: '# of Points',
data: [7, 11, 5, 8, 3, 7],
borderColor: 'orange',
stack: 'stack1'
},
{
label: '# of Points',
data: [5, 5, 5, 5, 5, 5],
borderColor: 'turquoise',
stack: 'stack1'
}
]
},
options: {
scales: {
y: {
stacked: true
}
}
}
}
var ctx = document.getElementById('chartJSContainer').getContext('2d');
new Chart(ctx, options);
<body>
<canvas id="chartJSContainer" width="600" height="400"></canvas>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.7.1/chart.js"></script>
</body>
我有下面这张图表
它们堆叠在一起。我在我的选项中使用这个 属性:
scales: {
y: {
stacked: true,
}
},
如何仅对 1 个数据集禁用堆叠?我想禁用棕色数据集的堆叠,以便其他图表填充它。
棕色图表是 3 个小图表的总和。我想停用大棕色图表的堆叠,以便我可以查看我的图表数据是否正确显示。
您可以在数据集中指定堆栈。如果您将所有数据集分配给同一个堆栈,除了您的棕色数据集,您会得到您想要的:
var options = {
type: 'line',
data: {
labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"],
datasets: [{
label: '# of Votes',
data: [12, 19, 3, 5, 2, 3],
borderColor: 'pink',
stack: 'stack2'
},
{
label: '# of Points',
data: [7, 11, 5, 8, 3, 7],
borderColor: 'orange',
stack: 'stack1'
},
{
label: '# of Points',
data: [5, 5, 5, 5, 5, 5],
borderColor: 'turquoise',
stack: 'stack1'
}
]
},
options: {
scales: {
y: {
stacked: true
}
}
}
}
var ctx = document.getElementById('chartJSContainer').getContext('2d');
new Chart(ctx, options);
<body>
<canvas id="chartJSContainer" width="600" height="400"></canvas>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.7.1/chart.js"></script>
</body>