Nest() function in D3 v4 generating keys with $ sign

Question

I am using the d3.nest() function for the first time in an attempt to draw a choropleth in d3. Now when I nest the years and country, I see that a "$" sign is appended to both country (like $AUS) and year (like $1960). So, is it expected that I need to access the array as dataByCountryAndyear['$AUS'] ?

I read this post:

Include json in this d3.js calendar view?

It seems that the behavior is expected in d3 v4, however I want to understand what is the right way to access the object using a key in this scenario.

function ready(error, country_data, lfpr_data) {

  // converting strings to numbers where necessary
  lfpr_data.forEach(d => {
        d.year = +d.year
        d.female_lfpr = +d.female_lfpr;
        d.male_lfpr = +d.male_lfpr;
  });

  // nesting by country and year i.e for each country all years beneath it
  var dataByCountryByYear = d3.nest()
      .key(function(d) { return d.country; })
      .key(function(d) { return d.year; })
      .map(lfpr_data); 

  console.log(dataByCountryByYear['$AUS'])

  country_data.features.forEach(each_country => { 
    each_country.properties.years = dataByCountryByYear[each_country.id]
  });
}

My data looks like below:

year    country country_name    region  female_lfpr male_lfpr   total_lfpr
1960    ABW Aruba   Latin America & Caribbean   NA  NA  NA
1960    AFG Afghanistan South Asia  NA  NA  NA
1960    AGO Angola  Sub-Saharan Africa  NA  NA  NA
1960    ALB Albania Europe & Central Asia   NA  NA  NA
1960    AND Andorra Europe & Central Asia   NA  NA  NA
1960    ARE United Arab Emirates    Middle East & North Africa  NA  NA  NA
1960    ARG Argentina   Latin America & Caribbean   NA  NA  NA
1960    ARM Armenia Europe & Central Asia   NA  NA  NA
1960    ASM American Samoa  East Asia & Pacific NA  NA  NA
1960    ATG Antigua and Barbuda Latin America & Caribbean   NA  NA  NA

Answer 1

You are not using entries , which...

Applies the nest operator to the specified array, returning an array of key-values entries. (emphasis mine)

Instead, you're using map , which:

Applies the nest operator to the specified array, returning a nested map . (emphasis mine)

So, what your getting as the result of the nest is not an array, but a map . It's a different kind of object.

That being said, your two questions:

1. d3.map will automatically set the keys starting with a $ sign, as you can see in D3 source code :

    export var prefix = "$"; 

   But you don't need to mind about that prefix (more about that below).

2. Since that's a map, not an array, you have to use map's methods, like has , get or set . And when using those methods you don't need to use the dollar sign.

Here is an example with your code/data:

 const csv = `year,country,country_name,region,female_lfpr male_lfpr,total_lfpr 1960,ABW,Aruba,Latin America & Caribbean,NA,NA,NA 1960,AFG,Afghanistan,South Asia,NA,NA,NA`; const data = d3.csvParse(csv); const dataByCountryByYear = d3.nest() .key(function(d) { return d.country; }) .key(function(d) { return d.year; }) .map(data); console.log(dataByCountryByYear.has("AFG")) 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/5.7.0/d3.min.js"></script>