Chart.js 如何在chartjs栏中定义每个栏的起始位置
我试图建立一个类似于图中的图形 但是我找不到正确的方法,我想在同一个轴上连接线和条,对于每个条,我想定义起始Y位置和结束Y位置,我尝试使用多轴来做,但没有成功,我尝试的是类似的Chart.js 如何在chartjs栏中定义每个栏的起始位置,chart.js,bar-chart,linechart,react-chartjs,Chart.js,Bar Chart,Linechart,React Chartjs,我试图建立一个类似于图中的图形 但是我找不到正确的方法,我想在同一个轴上连接线和条,对于每个条,我想定义起始Y位置和结束Y位置,我尝试使用多轴来做,但没有成功,我尝试的是类似的 const data = { labels: ['January', 'February', 'March', 'April', 'May', 'June', July'], datasets: [{ label: 'Sales', type:'line',
const data = {
labels: ['January', 'February', 'March', 'April', 'May', 'June', July'],
datasets: [{
label: 'Sales',
type:'line',
data: [51, 65, 40, 49, 60, 37, 40],
fill: false,
borderColor: '#EC932F',
backgroundColor: '#EC932F',
pointBorderColor: '#EC932F',
pointBackgroundColor: '#EC932F',
pointHoverBackgroundColor: '#EC932F',
pointHoverBorderColor: '#EC932F',
yAxisID: 'y-axis-2'
},{
type: 'bar',
label: 'Visitor',
data: [200, 185, 590, 621, 250, 400, 95],
fill: false,
backgroundColor: '#71B37C',
borderColor: '#71B37C',
hoverBackgroundColor: '#71B37C',
hoverBorderColor: '#71B37C',
yAxisID: 'y-axis-1'
}]
};
const options = {
responsive: true,
tooltips: {
mode: 'label'
},
elements: {
line: {
fill: false
}
},
scales: {
xAxes: [
{
display: true,
gridLines: {
display: false
},
labels: {
show: true
}
}
],
yAxes: [
{
type: 'linear',
display: true,
position: 'left',
id: 'y-axis-1',
gridLines: {
display: false
},
labels: {
show: true
}
},
{
type: 'linear',
display: true,
position: 'right',
id: 'y-axis-2',
gridLines: {
display: false
},
labels: {
show: true
}
}
]
}
};
但这样,将有两个轴,一个在左侧,另一个在右侧,但都从相同的位置开始