时间戳

首页 > 解决方案 > d3 语言环境时间格式

d3.js - 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.timeFormatLocaleand d3.timeFormatDefaultLocale（方法 2）

方法二：

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.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", "Senin", "Selasa", "Rabu", "Kamis", "Jumat", "Sabtu"],
    "months": ["Januari", "Februari", "Maret", "April", "Mei","Juni","Juli","Agustus","September","Oktober","November","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.jslocaletime-format

解决方案

  1. 首先，您缺少一些所需的 定义d3.timeFormatLocale(definition)，

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

  • dateTime- 日期和时间 (%c) 格式说明符（例如，“%a %b %e %X %Y”）。
  • date- 日期 (%x) 格式说明符（例如，“%m/%d/%Y”）。
  • time- 时间 (%X) 格式说明符（例如，“%H:%M:%S”）。
  • periods- AM 和 PM 等效项（例如，[“AM”，“PM”]）。
  • days- 工作日的全名，从星期日开始。
  • shortDays- 工作日的缩写名称，从星期日开始。
  • months- 月份的全名（从一月开始）。
  • shortMonths- 月份的缩写名称（从一月开始）。
  1. 其次，最好使用自定义名称来防止它使用预定义的名称/变量。

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

您可以简单地修改里面的属性

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", "Senin", "Selasa", "Rabu", "Kamis", "Jumat", "Sabtu"],
        "months": ["Januari", "Februari", "Maret", "April", "Mei","Juni","Juli","Agustus","September","Oktober","November","Desember"],
        "shortMonths": ["Januari", "Februari", "Maret", "April", "Mei","Juni","Juli","Agustus","September","Oktober","November","Desember"]
  };
  
var IDTime = d3.timeFormatDefaultLocale(ID_Time);
  
var customformatTime = d3.timeFormat("%d %B %Y");
  
console.log(customformatTime(maxDate));

推荐阅读