Angular 2+のチャート

Question

添付した画像に似たグラフを作成したい、または棒グラフにすることもできます。 Angular 4を使用していますが、Angularのグラフについてはわかりません。参照リンクまたはサンプルコードはありますか？

[！[グラフ] [1]] [1]

Answer 1

Syncfusion angle-chartsを使用して要件を達成できます。 Syncfusionangle-chartsの詳細については、添付のデモおよびFTリンクをご覧ください。

サンプル： https://stackblitz.com/edit/angular-zo5arc?file=src/app/app.module.ts

スクリーンショット：

FT： https://www.syncfusion.com/angular-ui-components/angular-charts

デモリンク： https://ej2.syncfusion.com/angular/demos/#/material/chart/spline

UG： https://ej2.syncfusion.com/angular/documentation/chart/getting-started

Answer 2

私の提案は次のようになります：

1. Ng-Charts
2. D3.JS
3. PrimeNGにはチャートセクションがあります
4. DAG用のDagre.js（残念ながらjavascriptで）

5. Nice DAGの場合はNgx-graphですが、ドキュメントや弱いサポートはありません

6. スイムレーンからのngx-charts

7. HighCharts

8. 有向グラフのCytoscape.js
9. mermaidjs
10. Canvas.js -HTMLの代わりに角度重視のチャート。

Answer 3

Plotly.js を使用できます。これはAngularモジュールではありませんが、あなたのangular App。で使用できます。

eCharts もありますが、これは非常に強力で、優れたUIを備えています