chart.js - chartjs 2.7 如何在水平条形图的中心添加标签
问题描述
我有一个图表,如下所示,其中启用了工具提示,因为这些是必需的。
我想在最小值和最大值之间的中间值的 0 上放置标签。
我正在寻找的结果是。
我浏览了文档,但找不到任何似乎相关的内容。
提前致谢。
horizonalBarChart = new Chart(ctx, {
type: 'horizontalBar',
data: {
datasets: [
{
backgroundColor: "rgba(255,255,250,0)",
data: ["3.77", "4.89", "3.91", "3.34", "3.82", "3.85", "3.94", "3.83", "3.73", "3.33", "2.6", "3.86", "2.95", "3.12", "3.18", "3.05", "2.9"],
label: null
},
{
backgroundColor: ["#003f5c", "#003f5c", "#2f4b7c", "#2f4b7c", "#665191", "#665191", "#665191", "#665191", "#665191", "#a05195", "#a05195", "#d45087", "#d45087", "#d45087", "#d45087", "#d45087", "#d45087", "#f95d6a", "#f95d6a"],
data: ["1.78", "1.84", "1.61", "1.58", "1.6", "1.6", "1.6", "1.67", "1.73", "1.64", "1.86", "1.69", "1.77", "1.76", "1.74", "1.77", "1.79"],
label: null
}
]
},
options: {
responsive: true,
legend: {
display: false
},
scales: {
xAxes: [{
display: true,
scaleLabel: {
display: true,
labelString: ''
},
ticks: {
steps: 8,
stepSize: 1,
max: 8,
min: 0,
callback: function (value, index, values) {
return value - 4;
}
},
stacked: true
}],
yAxes: [
{
barPercentage: 0.6,
display: true,
position: 'left',
type: 'category',
labels: ["-9.72", "-7.16", "11.51", "13.39", "-4.41", "-3.31", "-9", "-41.33", "-16.88", "-3.63", "17.2", "-20.62", "-6.9", "-5.4", "-7.6", "-5.44", "-3.58"],
weight: 1,
stacked: true
},
{
offset: true,
display: true,
position: 'right',
type: 'category',
labels: ["10.92", "8.76", "-11.91", "-4.99", "64.41", "101.91", "149.4", "169.73", "45.08", "7.23", "-22", "109.62", "12.7", "6.2", "8.4", "6.84", "4.18"],
gridLines: {
display: false
}
}
]
}
}
});
解决方案
推荐阅读
- serverless - 无服务器离线不带环境变量
- xcode - 带有 10.15 和系统完整性保护的调试系统首选项窗格
- gradle - 从 JitPack 获取新发布的包失败
- linux - 为 SIGWINCH 设置信号会导致终端输出?
- javascript - 为什么我的 svg 图表无法为 IE 正确呈现?
- sql-server - 删除存储过程中的部分不起作用
- pytorch - pytorch中使用子模型的两种方法有什么区别?
- docker - Kubernetes pod 不需要重启
- mysql - 如何根据用户 ID 和 ID 访问的级别数使用 Google BigQuery 查找中位数?
- java - 为什么余数(模数)除法返回负数