0

I am trying to change the format of a json file sourcing a D3 map. The original source is World Choropleth by palewire.

EDIT: working code thanks to below answer in the Plunker: http://embed.plnkr.co/JYTATyrksAg3OJ0scHAp/

The original json is in a nested format with a count for each value:

  {
    "id": "IQ-G02-D009",
    "rate": "1"
  },
  {
    "id": "IQ-G05-D030",
    "rate": "4"
  },
  {
    "id": "IQ-G07-D047",
    "rate": "5"
  }
]

The new json will use a flat format, something like:

[
  {
    "id": "IQ-G02-D009"
  },
  {
    "id": "IQ-G05-D030"
  },
  {
    "id": "IQ-G05-D030"
  },
  {
    "id": "IQ-G05-D047"
  },
  {
    "id": "IQ-G07-D047"
  }
]

It seems using a rollup and nest function would be the way forward to get the new json in a similar form of the former one, but am getting stuck at implementing those in a queue().

The rollup should be implemented at the .defer level it seems:

queue()
    .defer(d3.json, "map.json")
    .defer(d3.json, "data.json")
    .await(ready);

Can I use the nest and rollup function directly in the queue?

ptitwolfy
  • 25
  • 3
  • this answer might help you https://stackoverflow.com/questions/34631591/trying-to-load-simple-csv-file-into-d3-with-queue-js – calmar Feb 24 '19 at 18:09
  • looking at your source code now, you can use nest and rollup after the data is fetched, inside your ready function. You could apply the roll up and nest inside the queue, using defer arguments, but it will end up on your await function. – calmar Feb 24 '19 at 18:13
  • thanks a lot, indeed the ready function seems like a more appropriate place. I am now trying to add the nest and rollup in there but without luck. See comments in updated Plunker: http://embed.plnkr.co/JYTATyrksAg3OJ0scHAp/ – ptitwolfy Feb 24 '19 at 19:35
  • on your plnkr , `activities` has no `rate` key, so that's probably your rollup is not working – calmar Feb 25 '19 at 01:14

1 Answers1

0

You had some typo's working against you. The general answer to your question, as cal_br_mar said: apply nest and roll up when your data is loaded. So:

queue()
  .defer(d3.json, "map.json")
  .defer(d3.json, "data.json")
  .await(ready)

function ready(error, country, activities) {
   activities = d3.nest()
     .key(function(d) {
       return d.id;
     })
     .rollup(function(v) {
       return v.length;
     })
     .entries(activities);  
}

You had a typo in your last line: it should be activities, not expenses (wrong copy and paste, I guess).

And in the code that follows it should be:

activities.forEach(function(d) {
  rateById[d.key] = +d.values;
});

The nest() and rollup puts your data in key and values properties, as you can see in your console output of the nested data:

[{"key":"IQ-G02-D009","values":1},{"key":"IQ-G05-D030","values":2},{"key":"IQ-G05-D047","values":1},{"key":"IQ-G07-D047","values":1}]

Change those fields and you should be fine.

Sietse Brouwer
  • 246
  • 1
  • 3