CODEWITHSUNDEEP
javascriptjsond3.jsmetricsgraphicsjs
B. Duarte
B. Duarte

Reputation: 35

Metricsgraphics Date access - Line graph

I am using the MetricsGraphic library for D3 visualization. For some reason, I can't figure out why my date parsing is not working. 

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'
    });
});

I keep getting a type error saying that it can't read property of 'time' undefined with my MG.convert.date function. I also don't know if I'm formatting my date correctly.

Here is an example of my JSON: 

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

Upvotes: 2

Views: 805

Answers (1)

Cyril Cherian
Cyril Cherian

Reputation: 32327

One way is using MG:

This is wrong:

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

This is right:

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

Full code below

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'
    });
});

Another way to do is this convert date using 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'
    });
});

Upvotes: 1

Related Questions