typescript - d3 TypeScript key function推荐的做法？

Question

我正试图围绕在 TypeScript 中为 d3 编写关键函数的最佳方法展开思考。

我有带有签名的数据{key: number, value: number}，我想编写一个返回的键函数，该函数d.key可以传递给.data()函数。

就目前而言，以下工作：

dataset = {key: number, value: number}[];
key = (d: any) => d.key;

d3.selectAll('rect')
  .data(this.dataset, this.key)

但是，每当我尝试如下定义关键功能时：

key = (d: {key: number, value: number}) => d.key;

我根据重载得到以下错误.data()：

Overload 1 of 3, '(data: { key: number; value: number; }[], key?: ValueFn<SVGSVGElement | Element | EnterElement | Document | Window, unknown, string>): Selection<...>', gave the following error.
    Argument of type '(d: { key: number; value: number; }) => number' is not assignable to parameter of type 'ValueFn<SVGSVGElement | Element | EnterElement | Document | Window, unknown, string>'.
      Type 'number' is not assignable to type 'string'.
  Overload 2 of 3, '(data: ValueFn<SVGSVGElement, unknown, unknown[]>, key?: ValueFn<SVGSVGElement | Element | EnterElement | Document | Window, unknown, string>): Selection<...>', gave the following error.
    Argument of type '{ key: number; value: number; }[]' is not assignable to parameter of type 'ValueFn<SVGSVGElement, unknown, unknown[]>'.
      Type '{ key: number; value: number; }[]' provides no match for the signature '(this: SVGSVGElement, datum: unknown, index: number, groups: SVGSVGElement[] | ArrayLike<SVGSVGElement>): unknown[]'.

在 TypeScript 中使用 d3 时指定类型安全键函数的推荐方法是什么？

标签： typescriptd3.js