Javascript d3 v4映射意外变为空

我试图从csv中读取数据，并用key=state缩写和value=数据中该状态的频率形成一个映射

我的代码正确地创建了一个映射并读取了数据，我可以正确地

console.log（map）

但是，当我尝试使用

.each

或

.entries（）

遍历映射时，映射是空的

map.size（）

返回0

var statesData = d3.map();
d3.csv("temp-data.csv", function(error, data) {
    if (error) throw error;
    data.forEach(function(row) {
        if (statesData.has(row.state) == false) {
          statesData.set(row.state, 1);
        }
        else {
          statesData.set(row.state, statesData.get(row.state) + 1);
        }
    });
});
console.log(statesData);
console.log(statesData.size());
statesData.each(function(d) {
  console.log("value: " + d);
});

输出：

{}
"$AZ": 1
​
"$CA": 1
​
"$CO": 1
​
"$IA": 1
​
"$KS": 2
​
"$OK": 1
​
"$OR": 1
​
"$PA": 1
​
"$WA": 1
​
<prototype>: Object { constructor: Map(), has: has(), get: get()
, … }
0

因此，似乎映射中包含数据，但当我调用

.size（）

时，它返回0（这解释了

.each（）

方法不显示任何输出的原因）

我真的不明白为什么会发生这种情况。我试着阅读文档，但它不明白为什么我可以

console.log（MAP）

很好，但不能反复阅读它

谢谢！

明白了：

d3.csv是一个异步请求，因此依赖于该函数提供的数据的所有代码都应该在该范围内

这解释了为什么

d3.csv

范围之外的

statesData

的大小为0

以下是：

var statesData = d3.map();
d3.csv("temp-data.csv", function(error, data) {
    if (error) throw error;
    data.forEach(function(row) {
        if (statesData.has(row.state) == false) {
          statesData.set(row.state, 1);
        }
        else {
          statesData.set(row.state, statesData.get(row.state) + 1);
        }
    });

    console.log(statesData.size())
});

正确输出

9

var statesData = d3.map();
d3.csv("temp-data.csv", function(error, data) {
    if (error) throw error;
    data.forEach(function(row) {
        if (statesData.has(row.state) == false) {
          statesData.set(row.state, 1);
        }
        else {
          statesData.set(row.state, statesData.get(row.state) + 1);
        }
    });

    console.log(statesData.size())
});