Formatting Duration

A duration formatter will format numeric value into duration format, which is mostly used on a duration-based value axis.

Available Codes

Each of the codes can repeated as many times as needed. If the actual number is shorter than a number of digits, it will be padded with zeros.

As a note, the codes are a subset of available Date formatting pattern codes.

Code	Meaning
y	Years (a year is 365 days)
M	Months (a month is 31 days)
w	Weeks (a week is 7 days)
d	Days (a day is 24 hours)
h	Hours (an hour is 60 minutes)
m	Minutes (a minute is 60 seconds)
s	Seconds (a second is 1000 milliseconds)
S	Milliseconds
a	Special indicator that must always go after other codes. Indicates that absolute value should be used. (no minus sign)
’ (single quote)	Text enclosed in single quotes will be treated as text and will be displayed as is without parsing it for codes

Examples

Source value	Base unit	Format	Output
61	second	hh:ii:ss	00:01:01
1005	millisecond	s.qqq	1.005
70	day	m ‘months’ d ‘days’	2 months 8 days

Styling output

Text formatting codes, like [bold], can be used to format chunks of outputed text . Please refer to “Formatting Strings” for more details.

Overriding format

As we saw in our introductory article on Formatters, you can override global or local durationFormat with a DurationFormatter data field function formatDuration().

series.tooltipText = "{valueY.formatDuration('mm:ss')}";

series.tooltipText = "{valueY.formatDuration('mm:ss')}";

"series": [{
  // ...
  "tooltipText": "{valueY.formatDuration('mm:ss')}"
]}

Duration axis