首页 > 解决方案 > 更新 d3 转换或选择的函数的正确类型

问题描述

我正在尝试为某些更新某些 svg 元素位置的 TypeScript d3 代码找出正确的类型。代码既可以在没有过渡的情况下运行(即它应该立即更新),也可以在有过渡的情况下运行。我编写了一个辅助方法来执行更新,但我无法确定正确的类型。我的代码是这样工作的:

const circles = group.selectAll('circle').data(points);
if (transitionsEnabled) {
    updateCircles(circles.transition().duration(1000));
} else {
    updateCircles(circles);
}

function updateCircles(circles: d3.Selection<d3.BaseType, Point, d3.BaseType, {}> {
    circles
       .attr('cx', (d: Point) => d.x)
       .attr('cy', (d: Point) => d.y)
       .attr('r', 5);
}

这给了我一个错误:Argument of type 'Transition<BaseType, Point, BaseType, {}>' is not assignable to parameter of type 'Selection<BaseType, Point, BaseType, {}>在启用转换的调用上。

将函数参数的类型切换为 Transition 会产生等效错误。我可以通过给函数参数一个类型来解决它

d3.Selection<d3.BaseType, Point, d3.BaseType, {}>|d3.Transition<d3.BaseType, Point, d3.BaseType, {}>

但这似乎很难看。有没有更好的方法来输入这个方法?我可以创建一个类型别名来使事情变得更顺畅,但这似乎应该已经存在。

标签: typescriptd3.jsdefinitelytyped

解决方案


推荐阅读