javascript - Metricsgraphics 日期访问 - 折线图

Question

我正在使用 MetricsGraphic 库进行 D3 可视化。出于某种原因，我无法弄清楚为什么我的日期解析不起作用。

d3.json('/api/data', function (data){
    data = MG.convert.date(data, "Date"["%d/%m/%y"]);
    MG.data_graphic({
        title: "Points per Matchday",
        description: "Points earned each matchday of 2014/2015 season",
        data: dataSet,
        width: 600,
        height: 200,
        right: 40,
        target: document.getElementById('arsenalPoints'),
        x_accessor: 'Date',
        y_accessor: 'Points'
    });
});

我不断收到类型错误，提示它无法使用我的 MG.convert.date 函数读取未定义的“时间”属性。我也不知道我的日期格式是否正确。

这是我的 JSON 示例:

{
    "Date" : "26/04/15",
    "HomeTeam" : "Arsenal",
    "AwayTeam" : "Chelsea",
    "FTR" : "D",
    "Points": 1
} 

Answer 1

一种方法是使用 MG:

这是错误的:

data = MG.convert.date(data, "Date"["%d/%m/%y"]);

这是对的:

data = MG.convert.date(data, "Date", "%d/%m/%y");//its not an array

完整代码如下

d3.json('/api/data', function (data){
    data = MG.convert.date(data, "Date", "%d/%m/%y");//its not an array
    MG.data_graphic({
        title: "Points per Matchday",
        description: "Points earned each matchday of 2014/2015 season",
        data: data, // Send in our data
        width: 600,
        height: 200,
        right: 40,
        target: document.getElementById('arsenalPoints'),
        x_accessor: 'Date',
        y_accessor: 'Points'
    });
});

另一种方法是使用 d3 转换日期:

d3.json('/api/data', function (data){
  data.forEach(function(j){
    j.Date = d3.time.format("%d/%m/%y").parse(j.Date);//convert it into date
  });
  MG.data_graphic({
        title: "Points per Matchday",
        description: "Points earned each matchday of 2014/2015 season",
        data: data, // Send in our data
        width: 600,
        height: 200,
        right: 40,
        target: document.getElementById('arsenalPoints'),
        x_accessor: 'Date',
        y_accessor: 'Points'
    });
});