# parse csv file as map object

**URL:** <https://talk.observablehq.com/t/parse-csv-file-as-map-object/2648>\
**Category:** Help\
**Created:** [December 14, 2019, 5:51am UTC](https://talk.observablehq.com/t/parse-csv-file-as-map-object/2648 "2019-12-14T05:51:09Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![biskwikman](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/biskwikman/32/2505_2.png) [@biskwikman](https://talk.observablehq.com/u/biskwikman)\
**Post date:** [December 14, 2019, 5:51am UTC](https://talk.observablehq.com/t/parse-csv-file-as-map-object/2648/1 "2019-12-14T05:51:09Z")

</div>

Hello,

I’m trying to make a choropleth map in d3 and I’m having difficulty parsing a csv file into a map object as shown in the example here: [https://observablehq.com/@d3/choropleth](https://observablehq.com/@d3/choropleth)

My notebook is here [https://observablehq.com/@biskwikman/japan-intra-prefectural-migration-map](https://observablehq.com/@biskwikman/japan-intra-prefectural-migration-map). The relevant code is as follows:

`fromAllMap = Object.assign(new Map(d3.csvParse(await FileAttachment("fromAllReduced.csv").text(), ({ja_name, population}) => [ja_name, +population])), {title: "Total Inter-Prefectural Immigration"})`

But the result is a Map of `undefined => 25399`, not of each name and it’s corresponding value as I wanted.

I’ve looked at multiple other examples and I can’t find what I’m doing differently. Can anyone help me out?

---

<div class="post-metadata">

**Author:** ![mbostock](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/mbostock/32/9_2.png) [@mbostock](https://talk.observablehq.com/u/mbostock)\
**Post date:** [December 14, 2019, 6:29am UTC](https://talk.observablehq.com/t/parse-csv-file-as-map-object/2648/2 "2019-12-14T06:29:11Z")

</div>

Try looking at just your data file alone:

```auto
d3.csvParse(await FileAttachment("fromAllReduced.csv").text())

```

You’ll see the columns are `name_ja` and `population`, but your code references `ja_name` and `population`. Here’s the fix:

```auto
fromAllMap = Object.assign(new Map(d3.csvParse(await FileAttachment("fromAllReduced.csv").text(), ({name_ja, population}) => [name_ja, +population])), {title: "Total Inter-Prefectural Immigration"})

```

---

<div class="post-metadata">

**Author:** ![biskwikman](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/biskwikman/32/2505_2.png) [@biskwikman](https://talk.observablehq.com/u/biskwikman)\
**Post date:** [December 14, 2019, 3:06pm UTC](https://talk.observablehq.com/t/parse-csv-file-as-map-object/2648/3 "2019-12-14T15:06:12Z")

</div>

omg thank you! I was looking at this thing for hours and couldn’t figure it out. I must have just not noticed the title was reversed.

---

<div class="post-metadata">

**Author:** ![biskwikman](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/biskwikman/32/2505_2.png) [@biskwikman](https://talk.observablehq.com/u/biskwikman)\
**Post date:** [December 14, 2019, 5:58pm UTC](https://talk.observablehq.com/t/parse-csv-file-as-map-object/2648/4 "2019-12-14T17:58:02Z")

</div>

I’m having another issue I would appreciate any help with. I can’t get my colors working on my map.

I know my colorscale is valid because it’s working on my legend, but I can’t find out what’s preventing it from showing up on my map.

I’ve parsed my data into a map object successfully, and my geometry is appearing onscreen. The common column is “name\_ja”.

I think it might have something to do with the implementation of the color function?

My relevant code is this:

`  
svg.append(“g”)

```
 .selectAll("path")
 .data(topojson.feature(japan, japan.objects.prefectures).features)
 .join("path")
   .attr("fill", d => color(data.get(d.name_ja)))
   .attr("d", path);

```

`

---

<div class="post-metadata">

**Author:** ![mbostock](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/mbostock/32/9_2.png) [@mbostock](https://talk.observablehq.com/u/mbostock)\
**Post date:** [December 14, 2019, 6:17pm UTC](https://talk.observablehq.com/t/parse-csv-file-as-map-object/2648/5 "2019-12-14T18:17:44Z")

</div>

> [@biskwikman](#):
>
> topojson.feature(japan, japan.objects.prefectures).features

Did you try inspecting the result of this expression? Probably you want to reference `d.properties.name_ja` instead of `d.name_ja`.

---

<div class="post-metadata">

**Author:** ![biskwikman](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/biskwikman/32/2505_2.png) [@biskwikman](https://talk.observablehq.com/u/biskwikman)\
**Post date:** [December 19, 2019, 1:16am UTC](https://talk.observablehq.com/t/parse-csv-file-as-map-object/2648/6 "2019-12-19T01:16:28Z")

</div>

Thanks for the tip. I think I know what’s wrong and how to fix it now. I think I’m mistakenly thinking of the cells like I do in Jupyter Notebook in terms of execution order and that’s not giving me what I thought I had. Hopefully once I sort that out it should work!

---

<div class="post-metadata">

**Author:** ![mbostock](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/mbostock/32/9_2.png) [@mbostock](https://talk.observablehq.com/u/mbostock)\
**Post date:** [December 19, 2019, 3:28pm UTC](https://talk.observablehq.com/t/parse-csv-file-as-map-object/2648/7 "2019-12-19T15:28:37Z")

</div>

> [@biskwikman](#):
>
> I think I’m mistakenly thinking of the cells like I do in Jupyter Notebook in terms of execution order and that’s not giving me what I thought I had.

Yep! See this notebook for more on how Observable runs code:

> **[How Observable Runs](https://observablehq.com/@observablehq/how-observable-runs)**
>
> If you’ve used other interactive notebooks before, you’re probably accustomed to code running from top to bottom. The first cell runs first, the second cell runs second and can reference values defined in the first cell, and so on down the page....

---

<div class="post-metadata">

**Author:** ![biskwikman](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/biskwikman/32/2505_2.png) [@biskwikman](https://talk.observablehq.com/u/biskwikman)\
**Post date:** [December 19, 2019, 4:55pm UTC](https://talk.observablehq.com/t/parse-csv-file-as-map-object/2648/8 "2019-12-19T16:55:06Z")

</div>

I’ve finally got it a basic version working! Thanks for your help in figuring it out!