2017-07-01 3 views
1

私はrect要素とtext要素を含むSVGを持っています。 D3Serviceを使用してd3Service/d3-ng2-service TypeScript TS2346提供されたパラメータが署名と一致しません

index.htmlを

<svg id="timeline" width="300" height="100"> 
    <g transform="translate(10,10)" class="container" width="280" height="96"> 
     <rect x="10" y="30" width="48" cy="10" r="30" height="60" class="timelineSeries_0" id="day1"></rect> 
     <rect x="58" y="30" width="48" cy="10" r="30" height="60" class="timelineSeries_0" id="day2"></rect> 
     <rect x="106" y="30" width="48" cy="10" r="30" height="60" class="timelineSeries_0" id="day3"></rect> 
     <rect x="154" y="30" width="48" cy="10" r="30" height="60" class="timelineSeries_0" id="day4"></rect> 
     <text class="textnumbers" id="day1" x="22.8" y="50">1</text> 
     <text class="textnumbers" id="day2" x="70.8" y="50">1</text> 
     <text class="textnumbers" id="day3" x="118.8" y="50">1</text> 
     <text class="textnumbers" id="day4" x="116.8" y="50">1</text> 
    </g> 
</svg> 

d3-ng2-serviceから、私は次のことをやっている:

let day = 1; 
let rect_id = "rect#day" + day; 
let ele = D3.select<SVGRectElement>(rect_id).node(); 
let label_id = rect_id.replace("rect", ".textnumbers"); 
let numberEle = D3.select<TextElement>(label_id); 

私が選択してTS2346エラーを取得しています: error TS2346: Supplied parameters do not match any signature of call target.

D3Serviceのindex.d.tsは:

https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/d3-selection/index.d.ts#L155

ライン162上では、こう述べています。

select<DescElement extends BaseType>(selector: string): Selection<DescElement, Datum, PElement, PDatum>;

私はindex.d.tsそこから間違った要素の型を取得していますし、私はSVGRectElementTextElement以外の何か他のものを使用する必要があります推測していますしかし、私は何を理解することはできません。 Angular2コンポーネントは実際にはうまく動作します。正しい要素タイプを見つけるためにindex.d.tsファイルを読むにはどうすればよいですか?ありがとう!

答えて

1

あなたはselect()メソッドシグネチャで見ることができるように:

select<DescElement extends BaseType>(selector: string): Selection<DescElement, Datum, PElement, PDatum>;

選択方法はSelection要素を返し、そうSVRectElementへのキャストはできません。また、キャストは(必要ならば)このように呼び出されたメソッドの前に行く必要があります。この場合let ele = <SVGRectElement> D3.select(rect_id).node();

、しかし、キャストが必要がないので、コードは次のようになります

let rectEle = self.d3.select(rectId);

関連する問題