D3 中的 GeoJSON：路径未绑定到数据

Question

详情：

我有以下设置。生成自定义 topjson 文件，只是想在我的网页中显示它。我可以在控制台中看到，已创建并且数据已正确加载，但由于某种原因 d3 未呈现任何路径元素并且未显示任何内容。

Javascript

var width = 960;
    var height = 500;


    var svg = d3.select('body').append('svg')
        .attr('width', width)
        .attr('height', height);


    var projection = d3.geo.albersUsa()
        .scale(1000)
        .translate([width / 2, height / 2]); 


    var path = d3.geo.path()
        .projection(projection);

        d3.json('http://localhost.com/calgary.json', function(error, calgary) {
        svg.append('path')
        .datum(topojson.feature(calgary))
        .attr('d', path)
        .attr('fill','red');
        });

自定义 Topojson 文件：

http://pastebin.com/ere2Ww7K

依赖于：

<script src="http://d3js.org/d3.v3.min.js"></script>
    <script src="http://d3js.org/topojson.v1.min.js"></script>
    <script>

Answer 1

对我来说，您的代码中似乎有两个错误：
首先，在 json 加载时调用的函数内部，数据内部的 topojson 调用需要两个参数，第二个是一个对象：

.datum(topojson.feature(calgary, calgary.objects.CALGIS_ATS_SECTIONS))

其次，您的 topojson 文件似乎已损坏。在第一次更正之后，我看到了一些东西，但它只是一堆多边形，填满了一个大矩形。

我用一个有效的 topojson 文件尝试了完全相同的调用，即 http://bl.ocks.org/mbostock/raw/4090846/us.json，在之前的调用中用 "land" 替换了 "CALGIS_ATS_SECTIONS"，它确实有效顺利。

D3 中的 GeoJSON：路径未绑定到数据

GeoJSON in D3: Paths aren't being bound to data

d3.js

jquery-svg

详情：

自定义 Topojson 文件：

依赖于：