我使用的示例D3图显示为here.我在这里声明了以下数据对象：
interface ID3Data {
age: string,population: number
}
const data: ID3Data[] = [
{ age: "<5",population: 2704659 },{ age: "5-13",population: 4499890 }
]
然后被以下对象消耗：
const pie = d3.pie()
.value(function(d: any) { return d.population; });
const arc = g.selectAll(".arc")
.data(pie(data)) // ->>> Specifically this part of the code
产生此错误：
TypeScript error: Argument of type 'ID3Data[]' is not assignable to parameter of type '(number | { valueOf(): number; })[]'.
Type 'ID3Data' is not assignable to type 'number | { valueOf(): number; }'.
Type 'ID3Data' is not assignable to type '{ valueOf(): number; }'.
Types of property 'valueOf' are incompatible.
Type '() => Object' is not assignable to type '() => number'.
Type 'Object' is not assignable to type 'number'. TS2345
既然d3.pie().value()显然消耗了非常特定类型的输入数据,那么我在做什么出错了,这会收到编译错误？由于D3的value函数特定于它的库…我可以在打字稿代码中覆盖它吗？
最佳答案
这是有问题的代码：
原文链接：https://www.f2er.com/js/531257.htmlconst pie = d3.pie()
.value(function(d: any) { return d.population; });
由于未指定要传递给生成器的数据类型,因此TypeScript编译器将使用以下type definition：
export function pie(): Pie<any,number | { valueOf(): number }>;
由于您的ID3Data类型显然与number |不匹配,因此导致您看到的错误. {valueOf()：number}.
幸运的是,在创建生成器时,可以使用泛型传递正确的数据类型来轻松解决此问题：
const pie = d3.pie<ID3Data>()
.value(function(d) { return d.population; }); // Do not use any for the parameter!
这将使编译器改为使用以下type definition：
export function pie<Datum>(): Pie<any,Datum>;
如您所见,类型基准现在传递给Pie interface类型.
