在工具提示中的时间之前添加文本
在工具提示中的时间之前添加文本
提问于 2018-09-14 22:46:08
我的数据集是基于每周数据的，并且我已经将xAxes配置为只显示月份和年份(避免使用太多标签)。现在，我想在工具提示中的日期之前添加文本。这是默认的TT：
如何将工具提示更改为: Week ending: 25/03/18
我尝试添加一个工具提示回调，但不能修改日期，只能修改标签。
options: {
scales: {
xAxes: [{
type: 'time',
position: 'bottom',
time: {
displayFormats: {'day': 'MM/YY'},
tooltipFormat: 'DD/MM/YY',
unit: 'month'
}
}]
},
tooltips: {
callbacks: {
label: function(tooltipItem, data) {
var label = data.datasets[tooltipItem.datasetIndex].label || ''
if (label) {
label = 'Week ending: ' + label
}
return label
}
}
}
}
回答 1
Stack Overflow用户
发布于 2018-09-15 00:08:47
下面是一个有效的演示，但您可以更好地增强查找周末值的功能，因为如果周末值大于30，则此功能不适用
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.2/Chart.js"></script>
<head>
<title>Bar Chart</title>
<style>
canvas {
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
}
</style>
</head>
<body>
<div id="container" style="width: 100%;">
<canvas id="canvas"></canvas>
</div>
<script>
var MONTHS = ['January', 'February'];
var barChartData = {
labels: ['03/20/2018', '03/10/2018'],
datasets: [{
label: 'Dataset 1',
borderWidth: 1,
data: [
1,
2
]
}, {
label: 'Dataset 2',
borderWidth: 1,
data: [
3,
4
]
}]
};
window.onload = function() {
var ctx = document.getElementById('canvas').getContext('2d');
window.myBar = new Chart(ctx, {
type: 'bar',
data: barChartData,
options: {
responsive: true,
legend: {
position: 'top',
},
tooltips: {
callbacks: {
label: function(tooltipItems, data) {
var xLabel = tooltipItems.xLabel;
var dt = new Date(xLabel);
var lastday = dt.getDate() - (dt.getDay() - 1) + 6;
var label = "Weekend Is: "+lastday;
return label;
}
}
},
title: {
display: true,
text: 'Chart.js Bar Chart'
}
}
});
};
</script>
</body>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/52334346
复制相关文章
相似问题
腾讯云开发者
