javascript - How to shorten the timezone name list got from moment.js?

I am using moment.js ( the method I used is moment.tz.names()) to retrieve the timezone name list which enumerates over 500 cities across the world. The long list makes it not very efficient for the users to pick up the desired timezone. The question is whether there is a way to cut down on the size of the list, meaning group the cities in the same timezone offset together.

Share Improve this question edited Mar 10, 2016 at 9:33 Niklesh Raut 34.9k17 gold badges80 silver badges112 bronze badges asked Mar 10, 2016 at 9:31 ichbinblau 4,8095 gold badges25 silver badges38 bronze badges

Just because they've currently got the same time zone offset doesn't mean they're in the same time zone. Are you just suggesting this as a way of making it a two-step process? Are you trying to get the user's current time zone, or a different one? – Jon Skeet Commented Mar 10, 2016 at 9:40
Cos there are some duplicates in the timezone list if you take a look at the output of the moment.tz.names(). I can get the client timezone by js but I want to enable to users to choose another preferred timezone if they travel somewhere. – ichbinblau Commented Mar 10, 2016 at 9:45
Can you give examples of the duplicates? (I imagine there could be some which are back links, admittedly.) I'm just concerned that your way of determining that time zones are duplicates may not be correct. It does depend on your goals though - many time zones will be equivalent from now on" but weren't equivalent historically. – Jon Skeet Commented Mar 10, 2016 at 9:47
For instance, US/Arizona and America/Phoenix are duplicate. Phoenix is in Arizona. I just wanna make a easier list for the end user. – ichbinblau Commented Mar 10, 2016 at 9:52
2 Right - in that case, that's an alias (it's in the "backward" file in the IANA data). But Casablanca and London currently have the same offset, but are not the same time zone - that's the sort of thing you need to avoid. If there's anything in moment.js to give a "canonical" ID, that's what you really need in order to avoid duplicates. – Jon Skeet Commented Mar 10, 2016 at 9:58

| Show 2 more comments

4 Answers 4

Sorted by: Reset to default 7

Here are the Microsoft Time Zone Index Values, mentioned in another answer here by @stanleyxu2005.

{000, "Dateline Standard Time", "(GMT-12:00) International Date Line West"},
{001, "Samoa Standard Time", "(GMT-11:00) Midway Island, Samoa"},
{002, "Hawaiian Standard Time", "(GMT-10:00) Hawaii"},
{003, "Alaskan Standard Time", "(GMT-09:00) Alaska"},
{004, "Pacific Standard Time", "(GMT-08:00) Pacific Time (US and Canada); Tijuana"},
{010, "Mountain Standard Time", "(GMT-07:00) Mountain Time (US and Canada)"},
{013, "Mexico Standard Time 2", "(GMT-07:00) Chihuahua, La Paz, Mazatlan"},
{015, "U.S. Mountain Standard Time", "(GMT-07:00) Arizona"},
{020, "Central Standard Time", "(GMT-06:00) Central Time (US and Canada"},
{025, "Canada Central Standard Time", "(GMT-06:00) Saskatchewan"},
{030, "Mexico Standard Time", "(GMT-06:00) Guadalajara, Mexico City, Monterrey"},
{033, "Central America Standard Time", "(GMT-06:00) Central America"},
{035, "Eastern Standard Time", "(GMT-05:00) Eastern Time (US and Canada)"},
{040, "U.S. Eastern Standard Time", "(GMT-05:00) Indiana (East)"},
{045, "S.A. Pacific Standard Time", "(GMT-05:00) Bogota, Lima, Quito"},
{050, "Atlantic Standard Time", "(GMT-04:00) Atlantic Time (Canada)"},
{055, "S.A. Western Standard Time", "(GMT-04:00) Caracas, La Paz"},
{056, "Pacific S.A. Standard Time", "(GMT-04:00) Santiago"},
{060, "Newfoundland and Labrador Standard Time", "(GMT-03:30) Newfoundland and Labrador"},
{065, "E. South America Standard Time", "(GMT-03:00) Brasilia"},
{070, "S.A. Eastern Standard Time", "(GMT-03:00) Buenos Aires, Georgetown"},
{073, "Greenland Standard Time", "(GMT-03:00) Greenland"},
{075, "Mid-Atlantic Standard Time", "(GMT-02:00) Mid-Atlantic"},
{080, "Azores Standard Time", "(GMT-01:00) Azores"},
{083, "Cape Verde Standard Time", "(GMT-01:00) Cape Verde Islands"},
{085, "GMT Standard Time", "(GMT) Greenwich Mean Time: Dublin, Edinburgh, Lisbon, London"},
{090, "Greenwich Standard Time", "(GMT) Casablanca, Monrovia"},
{095, "Central Europe Standard Time", "(GMT+01:00) Belgrade, Bratislava, Budapest, Ljubljana, Prague"},
{100, "Central European Standard Time", "(GMT+01:00) Sarajevo, Skopje, Warsaw, Zagreb"},
{105, "Romance Standard Time", "(GMT+01:00) Brussels, Copenhagen, Madrid, Paris"},
{110, "W. Europe Standard Time", "(GMT+01:00) Amsterdam, Berlin, Bern, Rome, Stockholm, Vienna"},
{113, "W. Central Africa Standard Time", "(GMT+01:00) West Central Africa"},
{115, "E. Europe Standard Time", "(GMT+02:00) Bucharest"},
{120, "Egypt Standard Time", "(GMT+02:00) Cairo"},
{125, "FLE Standard Time", "(GMT+02:00) Helsinki, Kiev, Riga, Sofia, Tallinn, Vilnius"},
{130, "GTB Standard Time", "(GMT+02:00) Athens, Istanbul, Minsk"},
{135, "Israel Standard Time", "(GMT+02:00) Jerusalem"},
{140, "South Africa Standard Time", "(GMT+02:00) Harare, Pretoria"},
{145, "Russian Standard Time", "(GMT+03:00) Moscow, St. Petersburg, Volgograd"},
{150, "Arab Standard Time", "(GMT+03:00) Kuwait, Riyadh"},
{155, "E. Africa Standard Time", "(GMT+03:00) Nairobi"},
{158, "Arabic Standard Time", "(GMT+03:00) Baghdad"},
{160, "Iran Standard Time", "(GMT+03:30) Tehran"},
{165, "Arabian Standard Time", "(GMT+04:00) Abu Dhabi, Muscat"},
{170, "Caucasus Standard Time", "(GMT+04:00) Baku, Tbilisi, Yerevan"},
{175, "Transitional Islamic State of Afghanistan Standard Time", "(GMT+04:30) Kabul"},
{180, "Ekaterinburg Standard Time", "(GMT+05:00) Ekaterinburg"},
{185, "West Asia Standard Time", "(GMT+05:00) Islamabad, Karachi, Tashkent"},
{190, "India Standard Time", "(GMT+05:30) Chennai, Kolkata, Mumbai, New Delhi"},
{193, "Nepal Standard Time", "(GMT+05:45) Kathmandu"},
{195, "Central Asia Standard Time", "(GMT+06:00) Astana, Dhaka"},
{200, "Sri Lanka Standard Time", "(GMT+06:00) Sri Jayawardenepura"},
{201, "N. Central Asia Standard Time", "(GMT+06:00) Almaty, Novosibirsk"},
{203, "Myanmar Standard Time", "(GMT+06:30) Yangon Rangoon"},
{205, "S.E. Asia Standard Time", "(GMT+07:00) Bangkok, Hanoi, Jakarta"},
{207, "North Asia Standard Time", "(GMT+07:00) Krasnoyarsk"},
{210, "China Standard Time", "(GMT+08:00) Beijing, Chongqing, Hong Kong SAR, Urumqi"},
{215, "Singapore Standard Time", "(GMT+08:00) Kuala Lumpur, Singapore"},
{220, "Taipei Standard Time", "(GMT+08:00) Taipei"},
{225, "W. Australia Standard Time", "(GMT+08:00) Perth"},
{227, "North Asia East Standard Time", "(GMT+08:00) Irkutsk, Ulaanbaatar"},
{230, "Korea Standard Time", "(GMT+09:00) Seoul"},
{235, "Tokyo Standard Time", "(GMT+09:00) Osaka, Sapporo, Tokyo"},
{240, "Yakutsk Standard Time", "(GMT+09:00) Yakutsk"},
{245, "A.U.S. Central Standard Time", "(GMT+09:30) Darwin"},
{250, "Cen. Australia Standard Time", "(GMT+09:30) Adelaide"},
{255, "A.U.S. Eastern Standard Time", "(GMT+10:00) Canberra, Melbourne, Sydney"},
{260, "E. Australia Standard Time", "(GMT+10:00) Brisbane"},
{265, "Tasmania Standard Time", "(GMT+10:00) Hobart"},
{270, "Vladivostok Standard Time", "(GMT+10:00) Vladivostok"},
{275, "West Pacific Standard Time", "(GMT+10:00) Guam, Port Moresby"},
{280, "Central Pacific Standard Time", "(GMT+11:00) Magadan, Solomon Islands, New Caledonia"},
{285, "Fiji Islands Standard Time", "(GMT+12:00) Fiji Islands, Kamchatka, Marshall Islands"},
{290, "New Zealand Standard Time", "(GMT+12:00) Auckland, Wellington"},
{300, "Tonga Standard Time", "(GMT+13:00) Nuku'alofa"}

This is something on the backlog for moment-timezone, in issue #227.

Below is the temporary workaround I provided there, which will shorten the list to 365 zone identifiers.

var names = Object.keys(moment.tz._zones)
    .map(function(k) { return moment.tz._zones[k].split('|')[0]; })
    .filter(function(z) { return z.indexOf('/') >= 0; })
    .sort();

This removes links and abbreviated zones from the list. We recognize this is still not ideal, and will improve upon this in a future release.

I think this is not a technical question but a design question. Showing 500+ cities in a dropdown list is not good UI design.

Here are some alternative ways:

Show timezone abbreviations, e.g. ['CST', 'EST', ...] or ['UTC', 'UTC+1', ...].
Maintain a reduced timezone list. For every timezone, show 2-3 most famous cities. Please refer the timezone settings of Windows.

I hope this can be helpful to you.

In case someone else would like to filter out deprecated timezones:

const deprecatedTimeZones = ["UCT", "PST8PDT", "GB", "MST7MDT", "EST5EDT", "W-SU", "CST6CDT", "HST", "MST", "Universal", "EET", "WET", "EST", "CET", "MET", "GMT", "Etc"];
const deprecatedTimeZonesRegex = `^${deprecatedTimeZones.join("|^")}`;

const allowedTimeZones = moment.tz.names()
    .filter(timezone => timezone.startsWith("A") || !new RegExp(deprecatedTimeZonesRegex).test(timezone))
    .sort((timezoneA, timezoneB) => timezoneA.localeCompare(timezoneB))
    .map(timezone => ({
        timezone,
    }));

Using react-select (or something similar) in frontend for selection will make this fine.

科技改变生活-雨落星辰 - 所有的伟大,都源于一个勇敢的开始

javascript - How to shorten the timezone name list got from moment.js? - Stack Overflow

4 Answers 4

与本文相关的文章

评论列表(0)