在react-vis时间刻度轴上设置24小时时间格式

时间:2019-03-20 08:06:29

标签: reactjs d3.js react-vis

我正在使用xType={'time'}和XY documentation中所述的俄语语言环境的XYPlot,是否可以将24小时格式传递给d3刻度?

scale

我需要的不是“ 03 AM”,而是“ 03:00”。

d3时间格式的俄罗斯语言环境的时间定义为%H,应为24小时:

{ "dateTime": "%A, %e %B %Y г. %X", "date": "%d.%m.%Y", "time": "%H:%M:%S", "periods": ["AM", "PM"], // ... some other options }

不幸的是,该设置不会影响秤的行为。

2 个答案:

答案 0 :(得分:4)

因此,根据您在网页结尾提供的链接,您可以注意到其他语言环境中的配置。您可以稍微调整一下时间来实现所需的条件:

import {timeFormatDefaultLocale} from 'd3-time-format';
timeFormatDefaultLocale({
    dateTime    : '%a %b %e %X %Y',
    date        : '%d/%m/%Y',
    time        : '%H%H:%m%m:%s%s',
    periods     : ['AM', 'PM'],
    days        : ['Dimanche', 'Lundi', 'Mardi', 'Mercredi', 'Jeudi', 'Vendredi', 'Samedi'],
    shortDays   : ['Di', 'Lu', 'Ma', 'Me', 'Je', 'Ve', 'Sa'],
    months      : ['Janvier', 'Février', 'Mars', 'Avril', 'Mai', 'Juin', 'Juillet', 'Août', 'Septembre', 'Octobre', 'Novembre', 'Decembre'],
    shortMonths : ['Jan', 'Fev', 'Mar', 'Avr', 'Mai', 'Jui', 'Juil', 'Aou', 'Sep', 'Oct', 'Nov', 'Dec']
});

您可以在这里找到日期格式:Javascript Date Format

答案 1 :(得分:0)

您可以使用Moment.js使用类似的方法:

<XAxis
     tickFormat={(v) => ${moment(v).format("h:mm a")}}
/>