d3 本地时间格式

问题描述

我想将我的月份和日期语言更改为 d3 时间格式 v6。我用了一些方法

const localeTime = {
    "days": ["Minggu","Senin","Selasa","Rabu","Kamis","Jumat","Sabtu"],"months": ["Januari","Februari","Maret","April","Mei","Juni","Juli","Agustus","September","Oktober","November","Desember"]
  };
  
  const localeFormat = d3.locale(localeTime);
  
  const formatTime = localeFormat.timeFormat("%d %B %Y");
  
  console.log(formatTime(date));

我收到 d3.locale is not a function 错误。然后我更改为 d3.timeFormatLocale 和 d3.timeFormatDefaultLocale（方法 2）

方法二：

const localeTime = {
    "days": ["Minggu","Desember"]
  };
  
  const localeFormat = d3.timeFormatLocale(localeTime);
  
  const formatTime = localeFormat.timeFormat("%d %B %Y");
  
  console.log(formatTime(date));

我收到此错误

Cannot read property 'map' of undefined
    at wy (VM25 d3.min.js:2)
    at Object.py [as timeFormatLocale] (VM25 d3.min.js:2)

当我不使用语言环境作为格式化程序时，由于语言环境定义，格式仍然不起作用

const localeTime = d3.timeFormatLocale({
    "days": ["Minggu","Desember"]
  });
  
  const formatTime = d3.timeFormat("%d %B %Y"); //I don't use the locale this time
  
  console.log(formatTime(date)); //It should be normally formatted as English date,but is not

我仍然收到 Cannot read property 'map' of undefined 错误。当我删除语言环境定义时，格式化程序在英语中工作正常

https://codepen.io/louislugas/pen/OJmmzwd 上的完整代码

解决方法

首先，您缺少一些定义 d3.timeFormatLocale(definition),

根据documentation，定义必须包括以下属性：

dateTime - 日期和时间 (%c) 格式说明符（例如，“%a %b %e %X %Y”）。
date - 日期 (%x) 格式说明符（例如，“%m/%d/%Y”）。
time - 时间 (%X) 格式说明符（例如，“%H:%M:%S”）。
periods - 上午和下午等价物（例如，["AM","PM"]）。
days - 工作日的全名，从星期日开始。
shortDays - 工作日的缩写名称，从星期日开始。
months - 月份的全名（从一月开始）。
shortMonths - 月份的缩写名称（从一月开始）。

其次，最好使用自定义名称来防止它使用预定义的名称/变量。

让我知道以下代码是否适合您：

你可以简单的修改里面的属性

var ID_Time = {
        "dateTime": "%d %B %Y","date": "%d.%m.%Y","time": "%H:%M:%S","periods": ["AM","PM"],"days": ["Minggu","Senin","Selasa","Rabu","Kamis","Jumat","Sabtu"],"shortDays": ["Minggu","months": ["Januari","Februari","Maret","April","Mei","Juni","Juli","Agustus","September","Oktober","November","Desember"],"shortMonths": ["Januari","Desember"]
  };
  
var IDTime = d3.timeFormatDefaultLocale(ID_Time);
  
var customformatTime = d3.timeFormat("%d %B %Y");
  
console.log(customformatTime(maxDate));

locale time-format