我正在尝试使用 chartJS 实现水平条形图。原型是这样的:但是我在实施负值时遇到了问题。您能否就如何在同一张图表上使用不同方向的条形图提供一些帮助?
2 回答

猛跑小猪
TA贡献1858条经验 获得超8个赞
可以使用浮动条来完成具有不同方向的绘制条。使用语法指定各个条形图[min, max]。此功能是在Chart.js v2.9.0中引入的。
new Chart(document.getElementById('canvas'), {
type: 'horizontalBar',
data: {
labels: [1, 2, 3, 4],
datasets: [{
label: 'data',
data: [[-3, 0], [0, 6], [-4, 0], [0, 5]],
backgroundColor: ['red', 'blue', 'green', 'orange']
}]
},
options: {
responsive: true,
legend: {
display: false
},
title: {
display: false
}
}
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.min.js"></script>
<canvas id="canvas" height="90"></canvas>
添加回答
举报
0/150
提交
取消