D3で折れ線グラフを生成しています。それは機能しますが、TypeScriptコードはvsに存在しないプロパティについて文句を言います。
プロパティ 'x'はタイプ '[number、number]'に存在しません
エラーを見てください。予想されるデータポイントは、2つの数値を持つ配列のようです。
しかし、私はオブジェクトを渡します。 D3は私が思う両方をサポートする必要があります。
私のデータを変更せずにこのエラーを取り除く方法を知っている人はいますか?
すでに述べたように、これはTypeScriptの解釈の問題です。プロパティにアクセスするために角かっこ表記を使用して修正しただけです。ちょうどこのような:
let line = d3.line()
.x(function (d) {
return x(d['date']);
})
.y(function (d) {
return y(d['temp']);
});
最良の方法は、TypeScriptオプション演算子(?)を使用することです。
function buildName(firstName: string, lastName?: string) {
if (lastName)
return firenter code herestName + " " + lastName;
else
return firstName;
}
let result1 = buildName("Bob"); // works correctly now
let result2 = buildName("Bob", "Adams", "Sr."); // error, too many parameters
let result3 = buildName("Bob", "Adams"); // ah, just right
詳細については https://www.typescriptlang.org/docs/handbook/functions.html
データが変数として渡される場合、そのデータをタイプany
として定義すると、TypeScriptが緩和されます。例:
// Append a 'text' SVGElement with data-driven text() to each 'g' SVGElement
d3.selectAll('g')
.each(function(d: any) {
d3.select(this)
.append('text')
.text(d.mytext);
});
そのTypeScriptエラー。
私はあなたのdに現在xプロパティがないと思います。これを試すことができますか
return this.xScale(d?.x);
return this.xScale(d?.y);
またはあなたのdがこのようなデータを持っているかもしれません["x_value","y_value"]
数値形式。
この場合、試してみてください
return this.xScale(d[0]);
return this.yScale(d[1]);
これがお役に立てば幸いです