Question

我目前正在尝试使用D3在波多黎各地图上建立一个等值线。使用Scott Murray's Example on Choropleths，我正在尝试将数据绑定到波多黎各的每个城市。我有一个占位符空对象来保存从CSV中提供的数据，如下所示：

var properties = {};

然后，我继续按行读取CSV文件。我将相应的值分配给一些变量，如：

properties.dataID = parseFloat(data[i].id);
properties.dataMunic_Total = parseFloat(data[i].municipio_total);
//etc.

一切都很好，花花公子。我在console.log中检查数据是否存储正确：

console.log(properties.dataID);
//Displays 1, which is correct.

但是，当我尝试访问整个对象时：

console.log(properties);

它只显示CSV文件的最后一行。我在第一个for循环中运行了最后一个console.log（）语句，在将数据分配给对象的属性后立即运行，每次循环遍历console.log（）时，它只显示CSV文件的最后一行

当我尝试将对象属性分配给我的地图对象（城市）时，它所分配的所有内容都是CSV文件的最后一行。所以我尝试单独设置它们，看到它似乎有效。但是，JavaScript抱怨该对象中不存在该属性：

obj.geometries[j].properties.year[properties.dataYear - 2000].id = properties.dataID;
Uncaught TypeError: Cannot read property 'id' of undefined

我尝试将其初始化，好像它是一个新变量：

var obj.geometries[j].properties.year[properties.dataYear - 2000].id = properties.dataID;

然后我把它拿回了控制台：

Uncaught SyntaxError: Unexpected identifier

除了语法错误之外，我认为这主要是因为我将一个数组附加到每个市镇，所以我每年可以保存不同的数据集......但我不明白为什么JavaScript会这样做方式。

我的问题是：为什么我的对象会这样做？ d3.csv有什么问题吗？我做错了吗？

Answer 1

如果要存储多个属性，则需要使用数组（即列表）。在您使用的代码中，您一次只创建一个变量properties而不保存对先前创建的变量的引用。也就是说，在循环的每次迭代中，您正在创建一个新对象，但丢失旧对象。

如果将properties声明为数组，然后在循环中追加新的属性对象，则可以稍后引用它们并使用它们绘制地图。代码看起来像这样。

var properties = [];
for(var i = 0; i < data.length; i++) {
  var property = {};
  property.dataID = parseFloat(data[i].id);
  property.dataMunic_Total = parseFloat(data[i].municipio_total);
  // ...
  properties.push(property);
}

在设置这样的数据后，您应该能够按照示例中的描述进行操作。

javascript中的对象卡在csv文件的最后一行

1 个答案: