Date formats you can display in Datawrapper
Once you've successfully uploaded your date column using a correct date format, you can choose how the date appears on your chart. On the Refine tab of the Visualize step for many charts, you have the ability to choose from a drop-down menu of date/tick formats:
Index
Available date formats
Once you've successfully uploaded your data using a correct date format, you can choose how the date appears on your chart. On the Refine tab of the Visualize step for many charts, you have the ability to choose from a drop-down menu of date/tick formats.
Option | Useful when? | Example output |
|
2015, 2016 |
When only a few years are shown |
2011, 2012, 2013, 2014, ... |
|
2015 Q1, 2016 Q2 |
When only a few quarters are shown |
2015 Q1, 2015 Q2, 2015 Q3, 2015 Q4, 2016 Q1, 2016 Q2... |
|
2015, Q2, Q3 |
When many quarters are shown |
2015 Q1, Q2, Q3, Q4, 2016 Q1, Q2, Q3, Q4, ... |
|
2015, Feb, Mar |
When months of a few years are shown |
2018 Oct, Nov, Dec, 2019 Jan, Feb, Mar, Apr, May, Jun, ... |
|
2015-2016, 2016-2016 | The "sport season format", for a few seasons |
2018-19, 2019-20, 2020-21 |
|
'15-'16, '16-'17 |
The "sport season format", for many seasons | '18-'19, '19-'20, '20-'21, | |
'15, '16 |
When a lot of years are shown | '11, '12, '13, '14, ... |
|
April, May |
When only a few months of just one year are shown |
June, July, August, September, October, November, ... |
|
Apr, May |
When a lot of months of just one year are shown | Jun, Jul, Aug, Sep, Oct, Nov, ... |
|
Apr '15, May '15 |
When months of a few years are shown |
Oct '15, Nov '15, Dec '15, Jan '16, Feb '16, Mar '16, ... |
|
April, 2, 3 |
When days are shown |
February 27, 28, 29, March 1, 2, 3, 4, 5, ... |
|
April 2, 2015 | When days over years are shown | January 1, 2024; March 17, 2025; October 27, 2027 | |
Custom date formats
The last option in the drop-down is "custom." Once selected, you can use tokens to create your own date format.
Below is a table of the accepted custom date formats and how they will appear on your chart:
Time Period | Token | Output |
Month | M |
1 2 ... 11 12 |
MM | 01 02 ... 11 12 | |
MMM | Jan Feb ... Nov Dec | |
MMMM | January February ... November December | |
Quarter | Q | 1 2 3 4 |
Week of Year | w | 1 2 3 4 |
ww | 01 02 03 04 | |
wo | 1st 2nd 3rd 4th | |
Day of Month | D | 1 2 ... 30 31 |
DD | 01 02 ... 30 31 | |
|
Do | 1st 2nd ... 30th 31st |
Day of Week | d | 0 1 ... 5 6 |
dd | Su Mo ... Fr Sa | |
ddd | Sun Mon ... Fri Sat | |
dddd | Sunday Monday ... Friday Saturday | |
Year | YY | 70 71 ... 19 20 |
YYYY | 1970 1971 ... 2019 2020 | |
Sports Season | B | '70-'71 '71-'72 ... '19-'20 '20-'21 |
|
BB | 1970-71 1971-72 ... 2019-20 2020-21 |
AM/PM | A | AM PM |
a | am pm | |
Hour | H | 0 1 ... 22 23 |
HH | 00 01 ... 22 23 | |
h | 1 2 ... 11 12 | |
hh | 01 02 ... 11 12 | |
k | 1 2 ... 23 24 | |
kk | 01 02 ... 23 24 |
|
Minute | m | 0 1 ... 58 59 |
mm | 00 01 ... 58 59 | |
Second | s | 0 1 ... 58 59 |
ss | 00 01 ... 58 59 | |
Millisecond | SSS | 000 001 ... 998 999 |
Time Zone (offset from UTC) | Z | -07:00 -06:00 ... +06:00 +07:00 |
ZZ | -0700 -0600 ... +0600 +0700 | |
Unix Timestamp in second | X | 1360013296 |
Unix Timestamp in millisecond | x | 1360013296123 |
Combining custom tokens
By combining different tokens, you can create a custom date format. You can also use punctuation marks (commas, dots, slashes, etc) between tokens, which will appear on the chart. Here is an example of using a custom date format and how it will appear in your chart:
Since MM is the month number and YYYY the full year, our result is something like "01--2003" (the "--" appears because it is written in the tick format text box). Here is how it appears on a chart:
Use a different format for the first axis tick
You can make use of the syntax ~~
to specify a special format for the first axis ticks:
In this example, we use the format YYYY~~'YY
to display the axis like so:
You can combine tokens as you need them with the ~~
syntax. For example, you could use the custom format MMMM YYYY~~MMM
to show the following axis ticks:
Localized Formats
Because preferred formatting differs based on locale, there are a few tokens that can be used to format a moment based on its locale. All of these tokens are affected by the Output Locale, which can be changed in the Check and Describe step or the Design tab of the Visualize step. The US and Germany are featured in the chart below.
Time Period | Token | Output (en-US) | Output (de-DE) |
Time | LT | 8:30 PM | 20:30 |
Month numeral, day of month, year |
L | 01/30/2019 | 01.30.2019 |
l lowercase L | 1/30/2019 | 1.30.2019 | |
Month name, day of month, year |
LL | January 30, 2019 | 30. Januar 2019 |
ll | Jan 30, 2019 | 30. Jan 2019 | |
Month name, day of month, year, time |
LLL | January 30, 2019 8:30 PM | 30. Januar 2019 20:30 |
lll | Jan 30, 2019 8:30 PM | 30. Jan 2019 20:30 | |
Month name, day of month, day of week, year, time |
LLLL | Wednesday, January 30, 2019 8:30 PM | Mittwoch, 30. Januar 2019 20:30 |
llll | Wed, Jan 30, 2019 8:30 PM | Mi, 30. Jan 2019 20:30 |
Here is an example of how to use a localized format:
Using the example from before, if our Output Locale is set to English (en-US), the date will appear July 1, 2003. If the Output Locale is set to Deutsch (de-DE), the date will appear 1. Juli 2003.
For more information about working with dates and times in Datawrapper, see this article.