topojson/d3.js：未捕获(在承诺中)类型错误：无法读取未定义的属性'type'

Question

我正试图从数据可视化认证中开发freeCodeCamp的第四个项目，choropleth地图。这是我写的：

const promisses = [d3.json('https://raw.githubusercontent.com/no-stack-dub-sack/testable-projects-fcc/master/src/data/choropleth_map/counties.json'), d3.json('https://raw.githubusercontent.com/no-stack-dub-sack/testable-projects-fcc/master/src/data/choropleth_map/for_user_education.json')];
Promise.all(promisses).then((d)=>{return processData(d)});
function processData(data) {
for (let i = 0; i < data.length; i++) {
//console.log(JSON.stringify(data[i]));
}

let w = 800;
let h = 0.6 * w;
let padding = 40;

let svg = d3.select('#chart-bg').append('svg');

svg.attr('width', w + 2 * padding)
.attr('height', h + 2 * padding)
.attr('id','map')

console.log(JSON.stringify(data[0].objects.counties));

//The next line is where I am having trouble
let counties = topojson.feature(data[0].objects.counties);
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/topojson/3.0.2/topojson.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/5.7.0/d3.min.js"></script>

直到最后一行都没有出现任何问题，但后来它说"Uncaught(in promise(TypeError:无法读取未定义的属性'type'"。有人知道为什么会发生这种事吗？data[0].objects.counties日志记录正常。

EDIT:data[0].objects.counties具有"type"属性和"geometrys"属性。

Answer 1

topojson.feature采用两个参数，如topojson文档中所示：

topojson.feature(topology, object);

您只指定了要提取的对象：

let counties = topojson.feature(data[0].objects.counties);

错误可能源于缺少第二个参数：由于没有定义第二个变量，因此第二个常量的type未定义。

使用这两个参数，您可以使用以下两个参数毫无错误地提取您的功能：

let counties = topojson.feature(data[0], data[0].objects.counties);

const promisses = [d3.json('https://raw.githubusercontent.com/no-stack-dub-sack/testable-projects-fcc/master/src/data/choropleth_map/counties.json'), d3.json('https://raw.githubusercontent.com/no-stack-dub-sack/testable-projects-fcc/master/src/data/choropleth_map/for_user_education.json')];
Promise.all(promisses).then((d)=>{return processData(d)});
function processData(data) {
for (let i = 0; i < data.length; i++) {
//console.log(JSON.stringify(data[i]));
}

let w = 800;
let h = 0.6 * w;
let padding = 40;

let svg = d3.select('#chart-bg').append('svg');

svg.attr('width', w + 2 * padding)
.attr('height', h + 2 * padding)
.attr('id','map')


//The next line is where I am having trouble
let counties = topojson.feature(data[0], data[0].objects.counties);
console.log(JSON.stringify(counties));
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/topojson/3.0.2/topojson.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/5.7.0/d3.min.js"></script>