我正在使用chart.js在我的网站上创建组合图表。
我面临的问题是当线条与柱状图相遇时,线条消失了。我认为这是因为线条图表显示在柱状图下面。
![enter image description here](https://istack.dev59.com/IFHrm.webp)
以下是我使用的代码:
var PCTCtx = document.getElementById("pctdiv").getContext("2d");
PCTChart = new Chart(PCTCtx, {
type: 'bar',
data: {
datasets: [{
label: 'Bar Dataset',
data: [100, 70, 60, 40],
backgroundColor: ['red', 'red', 'red', 'red']
}, {
label: 'Line Dataset',
data: [50, 50, 50, 50],
fill: false,
backgroundColor: ['#000000', '#000000', '#000000', '#000000'],
// Changes this dataset to become a line
type: 'line'
}],
labels: ['January', 'February', 'March', 'April']
},
options: {
scales: {
yAxes: [{
ticks: {
beginAtZero: true
},
gridLines: {
display: false
}
}],
xAxes: [{
barThickness: 35,
gridLines: {
display: false
}
}]
}
}
});
PCTChart.data.datasets[1].borderColor = '#000000';
PCTChart.update();
我需要在柱状图上显示这条线。
我已经为此创建了一个 jsfiddle,链接在此:https://jsfiddle.net/o7wL0j6d/4/。
任何帮助都将不胜感激。