Close
Angular React Web Components Blazor Blazor
Premium

Blazor ラジアル チャート

Ignite UI for Blazor ラジアル チャートは、データを取得し、円の周囲でラップされるデータ ポイントのコレクションとしてデータを描画するチャートのグループです (水平方向の線に沿って拡大するのではなく)。ラジアル チャートはチャートの範囲の最小から最大までのカテゴリのリストもマッピングし、カテゴリ グループ化メカニズムをサポートします。

Blazor ラジアル エリア チャート

Ignite UI for Blazor ラジアル エリア チャートは、データ ポイントを結ぶ直線のコレクションによってバインドされた塗りつぶされた多角形の形をしています。このチャートは、エリア チャートと同じデータ プロットの概念を使用しますが、データ ポイントを水平方向に引き伸ばすのではなく、円形の軸の周りにラップします。IgbDataChart コントロールでこのチャート タイプを作成するには、以下の例のように、データを IgbRadialAreaSeries にバインドします。

Blazor ラジアル縦棒チャート

ラジアル縦棒チャートは、チャートの中心からデータ ポイントの位置に向けて広がる矩形のコレクションを使用して表示されます。これは縦棒チャートと同じデータ プロットの概念を使用していますが、データ ポイントを水平方向に引き伸ばすのではなく、データ ポイントを円でラップします。IgbDataChart コントロールでこのチャート タイプを作成するには、以下の例のように、データを IgbRadialColumnSeries にバインドします:

Blazor ラジアル折れ線チャート

Ignite UI for Blazor ラジアル折れ線チャートは、データ ポイントを結ぶ直線のコレクションとして描画されます。このチャートは、折れ線チャートと同じデータ プロットの概念を使用しますが、データ ポイントを水平方向に引き伸ばすのではなく、円形の軸の周りにラップします。IgbDataChart コントロールでこのチャート タイプを作成するには、以下の例のように、データを IgbRadialLineSeries にバインドします:

Blazor ラジアル円チャート

ラジアル円チャートは、チャートの中心からデータ ポイントの位置に向けて広がる円スライスを使用します。このチャート タイプは、複数の一連のデータ ポイントを分類するという概念を採用しており、データ ポイントを水平線に沿って引き伸ばすのではなく、円形の軸に沿ってラップします。IgbDataChart コントロールでこのチャート タイプを作成するには、以下の例のように、データを IgbRadialPieSeries にバインドします:

Blazor ラジアル チャートのスタイル設定

ラジアル チャートを作成したら、線の色、マーカーの種類、またはそれらのマーカーのアウトライン色の変更など、スタイルをさらにカスタマイズしたい場合があります。この例は、IgbDataChart コントロールのスタイルをカスタマイズする方法を示しています。

Blazor ラジアル チャートの設定

さらに、ラベルはチャートの近くまたは広い位置に表示されるように設定できます。これは、IgbCategoryAngleAxisLabelMode プロパティで設定できます。

その他のリソース

関連するチャート タイプの詳細については、以下のトピックを参照してください。

API リファレンス

IgbDataChart
IgbRadialAreaSeries
IgbRadialColumnSeries
IgbRadialLineSeries
IgbRadialPieSeries
IgbCategoryAngleAxis
IgbNumericRadiusAxis