Question

我试图查看一些代码示例，但是我被困在这里。我有一个json，它以字符串形式读取日期。例如：

1993年1月1日是33970。

我在地图上有几个点，每个点都有关联的日期。我有一个基于日期的时间滑块。更新时间滑块后，我希望根据滑块的日期值更改点的外观。

// build slider

var inputValue = null;
var year = ["1993","1994","1995","1996","1997","1998","1999","2000","2001","2002","2003","2004","2005","2006","2007","2008","2009", "2010","2011","2012","2013","2014","2015","2016","2017","2018","2019"];

构建功能来更新滑块。

function update(value) {
document.getElementById("range").innerHTML=year[value];
inputValue = year[value];
d3.selectAll(".points")
    .attr("fill", dateMatch);
}

d3.select("#timeslide").on("input", function() {
    update(+this.value);
    console.log(value)

});

最后，构建将数据中的日期与时间滑块中的日期相匹配的函数！

function dateMatch(data, value) {
var d = new Date(data.properties.Sign_Date);
var y = [d.getFullYear()];
console.log(y)
console.log(d)
if (inputValue == y) {
    this.parentElement.appendChild(this);
    return "blue";
} else {
    return "#999";
};

}

我认为这里的模板应该可以工作，但是dateMatch函数中的日期读取存在问题。由于某种原因，它只是打印

Wed Dec 31 1969 16:00:41 GMT-0800 (Pacific Standard Time)

对于我数据中的每条记录。既然我的数据甚至没有追溯到1969年，那没有什么意义。谁能告诉我他们认为可能会打破的或者是更简便的过滤此时间数据的方法吗？

Answer 1

您需要将所有日期转换为真实日期。请注意，如果您不使用UTC（通用时区）或其他定义的时区，则日期转换将取决于计算机上设置的时区。有关javascript日期的更多信息，建议阅读MDN。

function createDateUTC(yourDateFormat) {
    var parsed = yourDateFormat.split('/'),
        day = +parsed[0],
        monthIndex = +parsed[1]-1,
        year = +parsed[2]
    return new Date(Date.UTC(year, monthIndex, day))
}

难以将JSON字符串转换为D3中的日期格式

1 个答案: