プロジェクトAngularversoin 6.0.3のバージョン6.2.0では、次のようにチャートを定義できました。
Highcharts.chart('container', {
chart: {
type: 'column'
},
title: {
text: 'Nombre de demande par processus par année'
},
exporting: {
enabled: false
},
xAxis: {
categories: ["2016", "2017", "2018", "2019"]
},
yAxis: {
min: 0,
title: {
text: 'Nombre de demande'
},
stackLabels: {
enabled: true,
style: {
fontWeight: 'bold'
}
}
},
legend: {
align: 'left',
x: 45,
verticalAlign: 'top',
backgroundColor: 'white',
borderColor: '#CCC',
borderWidth: 1,
shadow: false
},
tooltip: {
headerFormat: '<b>{point.x}</b><br/>',
pointFormat: '{series.name}: {point.y}<br/><b>Total: {point.stackTotal}</b>'
},
plotOptions: {
column: {
stacking: 'normal',
dataLabels: {
enabled: true,
color: 'white'
}
}
},
series: [{
name: 'MADC',
data: [0, 10, 60, 150],
color: '#52A233'
}, {
name: 'NA',
data: [652, 906, 1696, 1500],
color: '#218290'
}, {
name: 'Alice',
data: [874, 1300, 1986, 2355],
color: '#0A4170'
}]
});
Highchartsのバージョン7.0.1とAngularのバージョン7.1.0では、同じ方法でHighchartsを定義できます。
級数の定義が正しくないというエラーがあります:
タイプをタイプSeriesZigzagOptionsに割り当てることはできません。
Highchartsバージョン7.0.1
Angularバージョン7.0.1
すべてのブラウザ
こんにちは@olivierscheffler
問題について報告していただきありがとうございます。
エラーが指摘している行に関する情報を提供してください。
共有コードにはジグザグシリーズのリファレンスがないため、ロードされたHighchartsモジュールに関する情報も提供してください。
ライブデモを作成したり、問題を再現する方法を提供したりできれば、最善の方法です。
こんにちは@KacperMadej 、あなたの答えに感謝します。
実際、私のコードを確認した後、これはVsCodeとコンパイル中のエラーですが、stackblitzプロジェクトでこれを再現することはできません...
このエラーは、エディターのセクションシリーズで確認できます。
[ts]
Type '{ name: string; data: number[]; color: string; }' is not assignable to type 'SeriesAbandsOptions | SeriesAdOptions | SeriesAoOptions | SeriesApoOptions | SeriesAreaOptions | SeriesArearangeOptions | SeriesAreasplineOptions | SeriesAreasplinerangeOptions | ... 82 more ... | SeriesZigzagOptions'.
Property 'type' is missing in type '{ name: string; data: number[]; color: string; }' but required in type 'SeriesXrangeOptions'. [2322]
highcharts.d.ts(335083, 5): 'type' is declared here.
そして私のコマンドラインのエラー:
ERROR in src/app/app.component.ts(68,16): error TS2322: Type '{ name: string; data: number[]; color: string; }' is not assignable to type 'SeriesAbandsOptions | SeriesAdOptions | SeriesAoOptions | SeriesApoOptions | SeriesAreaOptions | SeriesArearangeOptions | SeriesAreasplineOptions | SeriesAreasplinerangeOptions | ... 82 more ... | SeriesZigzagOptions'.
Type '{ name: string; data: number[]; color: string; }' is not assignable to type 'SeriesZigzagOptions'.
Property 'type' is missing in type '{ name: string; data: number[]; color: string; }'.
src/app/app.component.ts(72,10): error TS2322: Type '{ name: string; data: number[]; color: string; }' is not assignable to type 'SeriesAbandsOptions | SeriesAdOptions | SeriesAoOptions | SeriesApoOptions | SeriesAreaOptions | SeriesArearangeOptions | SeriesAreasplineOptions | SeriesAreasplinerangeOptions | ... 82 more ... | SeriesZigzagOptions'.
Type '{ name: string; data: number[]; color: string; }' is not assignable to type 'SeriesZigzagOptions'.
Property 'type' is missing in type '{ name: string; data: number[]; color: string; }'.
src/app/app.component.ts(76,10): error TS2322: Type '{ name: string; data: number[]; color: string; }' is not assignable to type 'SeriesAbandsOptions | SeriesAdOptions | SeriesAoOptions | SeriesApoOptions | SeriesAreaOptions | SeriesArearangeOptions | SeriesAreasplineOptions | SeriesAreasplinerangeOptions | ... 82 more ... | SeriesZigzagOptions'.
Type '{ name: string; data: number[]; color: string; }' is not assignable to type 'SeriesZigzagOptions'.
Property 'type' is missing in type '{ name: string; data: number[]; color: string; }'.
コンパイル中にエラーは発生しません。エディターおよびコンパイル中にこのエラーを削除する方法は、シリーズタイプごとに「列」を追加することです。すべてが正常に機能します。
@olivierscheffler
...プロパティ 'type'がありません..。
各シリーズオプションオブジェクトは、定義されたタイプ(たとえば、 type: 'column'
)または設定されたTSタイプ( ... } as Highcharts.SeriesColumnOptions
)を持っている必要があります。
@ bre1470これはドキュメントで説明されていますか? そうでなければ、多分それは追加される可能性がありますか?
@KacperMadejええそれを見るのに時間がかかりました...それはどのドキュメントにも書かれておらず、以前のバージョンのHighchartsではシリーズにこれを書く必要がなかったからです。
今はうまく機能していますが、ドキュメントは調整する必要があると思います!
'またはTSタイプ(...}をHighcharts.SeriesColumnOptionsとして設定)'と言いました。 どういう意味 ?
ありがとう !
@olivierscheffler
私はこのコメントを参照していました-https : //github.com/highcharts/highcharts-declarations-beta/issues/8#issuecomment-436662606
@KacperMadej
それは宣言で言及されていますが、おそらく適切な場所ではありません。 さらに、TypeScript情報をAPIドキュメントに追加することを検討する必要があります。 どう思いますか?
これを一般的なドキュメントのどこかに記載しておくと便利です-https ://www.highcharts.com/docs/advanced-chart-features/highcharts-typescript-beta
APIドキュメントに情報を追加することも私見に役立ちます
おっと
@sudhirkaushk
このページはここから入手できます: https :
チャートを次のコードとして定義すると、この問題を解決するのに役立ちました。
(Highcharts as any).chart('hourCalls', {
chart: {
type: "column"
},
series: [
{
name: "Calls",
data: this.hourCalls,
type: undefined
}
]
});
最も参考になるコメント
@KacperMadej
それは宣言で言及されていますが、おそらく適切な場所ではありません。 さらに、TypeScript情報をAPIドキュメントに追加することを検討する必要があります。 どう思いますか?