Định dạng ngày trong D3.js

Question

Tôi có một cột (ngày) trong csv lưu trữ ngày trong "2003-02-01" (y-m-d). Tôi muốn định dạng ngày tháng và năm như tháng 4 năm 2003. làm thế nào để tôi làm điều đó?

var format = d3.time.format("%m-%Y"); 
data.forEach(function(d,i) { 
d.date = format(d.date); 
}); 

Tôi nhận được Lỗi báo lỗi sau: TypeError: n.getFullYear is not a function Line: 5

file csv chứa các giá trị:

200,300,400,288,123,2003-01-01 
300,700,600,388,500,2003-02-01 

vấn đề ở đây là gì?

Answer 1

Javascript không tự động nhận ra các giá trị trong tệp CSV dưới dạng ngày tháng, chỉ cần đọc chúng dưới dạng chuỗi. d3's time functions làm cho nó khá dễ dàng để chuyển đổi chúng sang datetime objects:

> parseDate = d3.time.format("%Y-%m-%d").parse 
> parseDate('2003-01-01') 
Wed Jan 01 2003 00:00:00 GMT-0600 (Central Standard Time) 

Để định dạng ngày tháng như bạn muốn, chúng ta cần phải đi theo con đường khác, từ một đối tượng ngày một chuỗi:

> formatDate = d3.time.format("%b-%Y") 
> formatDate(parseDate('2003-01-01')) 
"Jan-2003" 

tôi sẽ khuyên bạn nên đại diện cho ngày tháng của bạn trong chương trình của bạn với các đối tượng ngày tháng và chỉ định dạng chúng như các chuỗi khi bạn cần hiển thị chúng.

Answer 2

từ Adam trả lời, đây là một chức năng helper nhỏ để chuyển đổi một chuỗi thời gian từ một định dạng khác:

var formatTime = function(input, formatInput, formatOutput){ 
    var dateParse = d3.time.format(formatInput).parse; 
    var dateFormat = d3.time.format(formatOutput); 
    return dateFormat(dateParse(input)); 
}; 

sử dụng:

formatTime("2003-01-01", "%Y-%m-%d", "%b-%Y"); 

// output -> "Jan-2003" 

Answer 3

nếu bạn đang nhận được ngày cho phép nói trong biến "d = (ví dụ: '2003-03-01')" ở định dạng chuỗi rồi,

var monthNameFormat = d3.time.format("%b-%Y"); 
return monthNameFormat(new Date(d)); 

điều này sẽ dẫn đến ngày "Jan-2003 "định dạng.

Answer 4

Phiên bản D3 4 có các phương pháp thời gian khác nhau ngay bây giờ.

https://keithpblog.org/post/upgrading-d3-from-v3-to-v4/ https://github.com/d3/d3/blob/master/CHANGES.md

ngày nguồn của bạn

var d = {created_time : "2018-01-15T12:37:30+0000"} 

Cấu trúc của ngày đó =% Y-% m-% dT% H:% M:% S% Z

Tôi tìm kiếm google với "2018-01-15T12: 37: 30 + 0000" và đề xuất của nó đã cung cấp chuỗi cấu trúc ngày. Tiện dụng.

Tạo một timeParser để chuyển đổi (parse) chuỗi ngày của bạn thành một đối tượng ngày

var parseDate = d3.utcParse("%Y-%m-%dT%H:%M:%S%Z") 
//parseDate(d.created_time) 

Bây giờ tạo ra một định dạng thời gian để trả về một chuỗi ngày formated để hiển thị.

var formatDate = d3.timeFormat("%b-%Y") 
return formatDate(parseDate(d.created_time)) 

ví dụ: Jan-1970