7

I'm using XYPlot with xType={'time'} and Russian locale as described in documentation, is there a way to pass 24h time format to d3-scale?

scale

Instead of "03 AM" I need something like "03:00".

Russian locale from d3-time-format has time defined as %H, which should be 24 hours :

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

Unfortunately the setting doesn't affect scale behaviour.

0stone0
  • 34,288
  • 4
  • 39
  • 64
miki noidea
  • 782
  • 5
  • 15
  • The locale does affect the scale formatting, however, it is somewhere else that it is setup to use a formatting that includes the timeperiods (i.e. 12h clock format rather than 24h.) – Kaos Jun 19 '19 at 12:41

2 Answers2

4

So, according to the link you provided at the end of the web page, you can notice configuration in another locale. You can tweak its time a bit to achieve what you need:

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']
});

You can find date formats here: Javascript Date Format

altocumulus
  • 21,179
  • 13
  • 61
  • 84
Sania Khushbakht Jamil
  • 812
  • 6
  • 16
  • 1
    Time setting passed to timeFormatDefaultLocale() doesn't affect d3-scale behaviour. Basically that's the problem I'm trying to solve. I've expanded my question to make it more clear. – miki noidea Mar 20 '19 at 15:16
0

You can use something like this using Moment.js:

<XAxis
     tickFormat={(v) => ${moment(v).format("h:mm a")}}
/>
A Jar of Clay
  • 5,622
  • 6
  • 25
  • 39
Uma
  • 1