如何在Chart.js v2中格式化x轴时间刻度值

当我通过

options.scales.xAxes.time.tooltipFormat

将鼠标悬停在折线图上的数据点上时，我可以设置工具提示的格式，但我似乎无法设置x轴刻度标签的格式。My

data.labels

是力矩对象的数组。它们显示为“MMM DD，YYYY”（例如，2012年2月23日），但我想删除年份。

只需将所有选定时间单位的

显示格式设置为
MMM DD

options: {
  scales: {
    xAxes: [{
      type: 'time',
      time: {
        displayFormats: {
           'millisecond': 'MMM DD',
           'second': 'MMM DD',
           'minute': 'MMM DD',
           'hour': 'MMM DD',
           'day': 'MMM DD',
           'week': 'MMM DD',
           'month': 'MMM DD',
           'quarter': 'MMM DD',
           'year': 'MMM DD',
        }
        ...

请注意，我已将所有单元的显示格式设置为
mmmdd
。如果你能控制数据范围和图表大小，一个更好的方法是强制一个单位，就像这样

options: {
  scales: {
    xAxes: [{
      type: 'time',
      time: {
        unit: 'day',
        unitStepSize: 1,
        displayFormats: {
           'day': 'MMM DD'
        }
        ...


小提琴-
根据图表js文档页面。您可以使用回调函数格式化每个记号的值。例如，我想将显示日期的区域设置更改为始终为德语。在轴选项的各个部分中

ticks: {
    callback: function(value) { 
        return new Date(value).toLocaleDateString('de-DE', {month:'short', year:'numeric'}); 
    },
},

可以在将日期添加到数组之前设置日期格式。我就是这样做的。我用AngularJS

//将日期转换为标准格式

var dt = new Date(date);

//仅获取日期和月份，并将其推送到标签阵列

$rootScope.charts.mainChart.labels.push(dt.getDate() + "-" + (dt.getMonth() + 1));

在图表演示中使用此数组
我有一个不同的用例，我希望根据图表中数据的开始时间和结束时间之间的时间长度使用不同的格式。我发现这是最简单的方法

    xAxes = {
        type: "time",
        time: {
            displayFormats: {
                hour: "hA"
            }
        },
        display: true,
        ticks: {
            reverse: true
        },
        gridLines: {display: false}
    }
    // if more than two days between start and end of data,  set format to show date,  not hrs
    if ((parseInt(Cookies.get("epoch_max")) - parseInt(Cookies.get("epoch_min"))) > (1000*60*60*24*2)) {
        xAxes.time.displayFormats.hour = "MMM D";
    }

查看此代码笔我相信您的第二个代码段，
单位
和
单位步长
应该包含在
时间
对象中。我试着编辑，但被拒绝了，因为它偏离了你发帖的初衷……谢谢@tchan！更正。知道如何将日期（月）翻译成英语以外的其他语言吗？如果var是字符串（例如
'2021-03-10'
），而不是像
时刻
时间对象这样易于管理的对象，您最好通过向
time
方法添加
parser:'yyyyy-MM-DD'
来告诉
jschart
如何解析该字符串。总的来说，脚本的类型是：'time'，time:{parser:'yyyyy-MM-DD'，unit:'day'，unitStepSize:1，displayFormats:{'day'：'MMM DD'，}}我认为IE11在解决方案上存在问题，它将所有日期显示为“无效日期”，Chrome和Firefox可以正常工作。编辑：似乎是
新日期
实际上不起作用，因为我是在
2017年2月
这样的字符串上进行的。我似乎不太喜欢。你好@Rob Raymond！你也能看看我的问题吗。我也有类似的问题，但无法解决