创建d3等值区数据集

时间:2013-07-14 13:19:01

标签: javascript d3.js

我一直试图根据this example创建一个D3等值区。除了如何创建看起来像这样的unemployment.tsv之外,我已经理解了所有内容:

id      rate
1001    .097
1003    .091
1005    .134
1007    .121
...     ...

进一步挖掘之后,我看到id是对某些d3图形对象的引用。我的问题是,是否有一种简单的方法来设置这些ID的id值,还是我必须手动完成?

如果可能的话,我正在寻找一种像Google Charts一样简单的方法。

1 个答案:

答案 0 :(得分:4)

用于绘制地图的us.json文件包含有关每个县的大纲及其FIPS code的信息:

{"type":"Polygon","arcs":[[250,-204,-17]],"id":30047}

unemployment.tsv的每一行代表一个县,包含其FIPS代码和失业率。加载文件时,它将从对象数组转换:

> unemployment
[{id: '1001', rate: '.097'},
 {id: '1004', rate: '.091'},
 {id: '1005', rate: '.134'},
 ... ]

以一个对象作为县id,并将其作为值:

var rateById = {};
unemployment.forEach(function(d) { rateById[d.id] = +d.rate; });

> rateById
{1001: .097,
 1004: .091,
 1005: .134}

+d.rate将失业字符串转换为数字。)

完成后,为每个县着色很简单,只需在形状的ID中找到rateById中相应的失业率,然后将该数字转换为color比例的颜色。

.style("fill", function(d) { return color(rateById[d.id]); });

要更直接地回答您的问题:您可能希望使用国家/地区FIPS代码code县级*数据并使用该数据为地图着色。如果您不使用县数据,您可以尝试转换它(将纬度/长度或城市/州映射到县)或完全使用其他类型的地图(对于世界地图,请参阅this example及以下注释)。

*我没有任何类型的GIS背景 - 每次我尝试这样做时,我最终都会使用旧的FIPS代码 - >县名查表,必须用手纠正一对夫妇;在NIST网站上可能有一个我无法找到的更好的源文件。