类型“Selection<BaseType, {}, null, undefined>”上不存在属性“transition”

Question

我想在Angular2中使用d3js，但是当我想在元素更改时添加过渡时，会出现错误： Property 'transition' does not exist on type 'Selection<BaseType, {}, null, undefined>' 我使用Angular-cli生成项目，Angular的版本是4.0.0，d3js是4.8.0

这是我的typings.d.ts：

declare module 'd3' {
export * from 'd3-array';
export * from 'd3-axis';
export * from 'd3-brush';
export * from 'd3-chord';
export * from 'd3-collection';
export * from 'd3-color';
export * from 'd3-dispatch';
export * from 'd3-drag';
export * from 'd3-dsv';
export * from 'd3-ease';
export * from 'd3-force';
export * from 'd3-format';
export * from 'd3-geo';
export * from 'd3-hierarchy';
export * from 'd3-interpolate';
export * from 'd3-path';
export * from 'd3-polygon';
export * from 'd3-quadtree';
export * from 'd3-queue';
export * from 'd3-random';
export * from 'd3-request';
export * from 'd3-scale';
export * from 'd3-selection';
export * from 'd3-shape';
export * from 'd3-time';
export * from 'd3-time-format';
export * from 'd3-timer';
export * from 'd3-transition';
export * from 'd3-voronoi';
export * from 'd3-zoom';

}

这是我的 app.component.ts

import * as d3 from 'd3';
......
d3.select(this).select("path").transition().attr("d", function(d) {
            console.log(d);
            return arc2(<any>d);
        })

如果我删除transition()它效果很好。

怎么解决呢？谢谢

Answer 1

我已经通过以下方式修复了我的代码：

import { select as d3Select } from 'd3-selection';
import { transition as d3Transition } from 'd3-transition';
d3Select.prototype.transition = d3Transition;

然后在代码中使用 d3Select 代替 select

您可以关注： https ://github.com/DefinitelyTyped/DefinitelyTyped/issues/16176