在我使用 D3 v5 的 Angular 5 项目中,如果我提供以下内容,代码将编译:
let y0 = d3.scaleLinear().domain([0, 100000]).range([this.height, 0]);
但是,如果我为域的上限和下限提供以下变量名,则会出现错误:
let y0 = d3.scaleLinear().domain([d3.min(data.totalCount), d3.max(data.totalCount)]).range([this.height, 0]);
错误:TS2345:“string[]”类型的参数不可分配给“number |”类型的参数或 ({valueOf(): 数字;})[]'。类型“string”不可分配给类型“number |或 {valueOf(): number;}。
我知道传递给 d3.min 和 d3.max 的参数是数字,如果我提供一个测试数字数组,test = [1, 2, 3, 4]
,我得到同样的错误。
为什么要尝试将这些变量作为字符串读取?我做错了什么?
最佳答案
实际上有四个type definitions对于 d3.min()
:
export function min(array: ArrayLike<string>): string | undefined;
export function min<T extends Numeric>(array: ArrayLike<T>): T | undefined;
export function min<T>(array: ArrayLike<T>, accessor: (datum: T, index: number, array: ArrayLike<T>) => string | undefined | null): string | undefined;
export function min<T, U extends Numeric>(array: ArrayLike<T>, accessor: (datum: T, index: number, array: ArrayLike<T>) => U | undefined | null): U | undefined;
编译器会选择最适合你的代码,假设你没有提供任何类型参数,它会归结为第一个类型定义。如您所见,这需要一个 ArrayLike<string>
参数并返回 string
或 undefined
.这会产生您观察到的错误。 d3.max()
显然也是如此。 .
既然你知道你的 data.totalCount
都是数字,您可以轻松地将其作为泛型函数的类型参数传递:
let y0 = d3.scaleLinear().domain([
d3.min<number>(data.totalCount),
d3.max<number>(data.totalCount)
]).range([this.height, 0]);
旁注与您的问题没有直接关系:您可以使用 d3.extent()
结合了d3.min()
和 d3.max()
在一次通话中。
let y0 = d3.scaleLinear()
.domain(d3.extent<number>(data.totalCount))
.range([this.height, 0]);
关于javascript - D3.js v5 Domain() 不为数组取变量,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49661797/