Question

我有一个使用ng2-charts库的角度代码，并且想根据过滤器选项来格式化X轴标签数据。

如果我将过滤器选项设置为上一天/上个月/其他间隔<1年，则中间层将以Unix格式将数据点发送到前端，并且图表X轴标签应以'DD格式显示数据月，HH：mm am”或“ DD月，HH：mm pm”。例如：8月3日，上午3：12，9月2日，下午5:00

如果用户选择过滤器选项为去年/一年以上，则图表X轴标签应以“月DD，YYYY”格式显示数据。示例：2019年1月3日

我尝试了以下操作，但是它不起作用，并且无法将时间转换为上午或下午的12小时格式。

scales: {
    xAxes: [{
        display: true,
        type: 'time',
        time: {
            displayFormats: {
                'millisecond': 'DD MM, HH:mm',
                'second': 'DD Month, HH:mm',
                'minute': 'DD Month, HH:mm',
                'hour': 'DD Month, HH:mm',
                'day': 'DD Month, HH:mm',
                'week': 'DD Month, HH:mm',
                'month': 'DD Month, HH:mm',
                'quarter': 'DD Month, HH:mm',
                'year': 'Month DD, YYYY'
            }
            parser: 'MM/DD/YYYY HH:mm'
        }
    }]
}

Answer 1

找到了解决方案

 scales: {
        xAxes: [{
            display: true,
            type: 'time',
            distribution: 'series',
            gridLines: {
                display: true
            },
            time: {
                displayFormats: {
                    millisecond: 'D MMM, h:mm a',
                    second: 'D MMM, h:mm a',
                    minute: 'D MMM, h:mm a',
                    hour: 'D MMM, h:mm a',
                    day: 'D MMM, h:mm a',
                    week: 'll',
                    month: 'll',
                    quarter: 'll',
                    year: 'll'
                },
            },
            ticks: {
                autoSkip: true,
                maxTicksLimit: 15
            }
        }],

角ng2-图表x轴标签格式

1 个答案: