如何在D3中显示州县

我想在D3中显示WV的县级地图。我在网上找到了一个来自https://github.com/geary/polygonzo/tree/master/shapes/json的名为“wv-counties.json”的GeoJSON文件。当我看这个文件时，前几行如下：如何在D3中显示州县

{ 
"type": "FeatureCollection", 
"properties": 
    { 
    "kind": "state", 
    "state": "wv" 
    }, 
"features": [ 
    {"type":"Feature","bbox":[-80.2283,38.9446,-79.8121,39.3006],"properties":{"kind":"county","name":"Barbour","state":"wv","center":[-80.0202,39.1228],"centroid":[-80.0018,39.1309]},"geometry":{"type":"MultiPolygon","coordinates":[[[[-79.9764,39.2622],[-79.8942,39.3006],[-79.8121,39.2294],[-79.8230,39.1144],[-79.8942,38.9720],[-80.0859,38.9446],[-80.0531,38.9774],[-80.0531,39.0377],[-80.1297,39.0377],[-80.2283,39.1144],[-80.2228,39.1691],[-80.1681,39.2403]]]]}},

每个县都有一条线。

在我的javascript我有一句台词：

d3.json("wv-counties.json", function(error, wv)

之后，我可以打印WV对象到控制台，并看到它被装载。

我该如何去显示这个文件？

我已经试过这样：

svg.append("path") 
.data(wv) 
.attr("class", "county-border") 
.attr("d", path);

但只是得到一个空白屏幕。

我也试过这样：

svg.append("path") 
    .datum(topojson.mesh(wv)) 
.attr("class", "county-border") 
.attr("d", path);

但是，这会产生错误（最有可能的，因为该文件是不是TopoJSON文件）。

任何帮助表示赞赏。

来源

2013-11-22 user3018981

我建议这个教程是一个很好的介绍映射与以GeoJSON和D3：

http://www.schneidy.com/Tutorials/MapsTutorial.html

这就是说，这里的一些代码，让你开始：

var svg = d3.select('#wv-map'), // or however you want to select and/or create your svg 
    group = svg.append('g'), 
    projection = d3.geo.albersUsa(); 

d3.json("wv-counties.json", function(error, wv) { 

    group.selectAll('path') 
    .data(wv.features) 
    .enter().append('path') 
    .attr('d', d3.geo.path().projection(projection)) 
    .style('fill', 'silver') 
    .style('stroke', 'white') 
    .style('stroke-width', 1);  

});

的关键点在加载geoJson数据后，您需要使用enter选择将数据绑定到该数据，并使用projection绘制县道路，该数据将地理坐标从数据转换为坐标数据在你的svg。

来源

2013-11-22 17:16:32 Peter

我试过你的编辑，它开始成形。我看到输出，但线路不完全正确。尽管没有一些图像很难解释。我有可能在堆栈溢出处张贴一些截图吗？ – user3018981

很高兴它越来越近......试试这个截图：http://meta.stackexchange.com/questions/91716/how-to-upload-screenshots – Peter

好吧，我现在正在取得进展。感谢帮助。原来，我需要你的编辑和更好的数据源。上面的编辑和来自http://eric.clst.org/Stuff/USGeoJSON的数据是解决方案。 – user3018981

如何在D3中显示州县

回答

相关问题