syncfusion-maui-pyramid-charts

.NET MAUI ピラミッドチャートの実装

全体に占める割合を階層的なセグメントで可視化する Syncfusion® .NET MAUI ピラミッドチャート（SfPyramidChart）の実装方法をユーザーに案内します。高品質な .NET MAUI アプリケーションで、部分と全体の関係を表示するのに最適です。軸のない単一系列のチャートで、データはパーセンテージとして表され、各部分の合計が全体と一致します。

このスキルを使用する場面

ユーザーが次のことを行う場合に、このスキルを使用します。

• ピラミッドチャートを作成し、.NET MAUI アプリケーションで階層データや比例データを可視化する
• 部分と全体の関係を表示し、セグメントで全体に占める割合を表す
• ファネル形式の可視化を実装し、販売段階、プロセスフロー、人口統計の内訳を表示する
• ピラミッドチャートにツールチップ、凡例、データラベルなどのインタラクティブ機能を追加する
• パレット、グラデーション、セグメント間隔、向きを使って外観をカスタマイズする
• iOS/macOS アプリケーション向けに、液体ガラスのスタイルなどの最新の UI 効果を有効にする
• レポートやドキュメント用に、チャートの可視化を画像（JPEG/PNG）またはストリームとしてエクスポートする
• ビューモデルからピラミッドチャートのセグメントへのデータバインディングを構成する

コンポーネントの概要

SfPyramidChart コントロールでは、次の機能を利用できます。

• 単一系列の階層データの可視化
• カスタマイズ可能なインタラクティブなツールチップと凡例
• データラベルの豊富な配置オプション（Auto、Inner、Center、Outer）
• カスタムパレットブラシとグラデーションのサポート
• 2 種類のピラミッドモード：Linear（高さベース）と Surface（面積ベース）
• GapRatio によるセグメント間隔の調整
• 垂直方向および水平方向の向きのオプション
• 最新の液体ガラス視覚効果（iOS/macOS .NET 10+）
• 画像形式またはストリームへのエクスポート
• 凡例の操作による系列の表示切り替え
• 凡例が収まらない場合のスクロール対応

ドキュメントとナビゲーションガイド

はじめに

📄 参照： references/getting-started.md

ユーザーが次のことを行う場合に参照します。

• Syncfusion.Maui.Charts NuGet パッケージをインストールする
• XAML または C# で SfPyramidChart を初期化する
• ビューモデルを作成し、データをチャートにバインドする
• ItemsSource、XBindingPath、YBindingPath を構成する
• 基本的なピラミッドチャートの設定と名前空間のインポートについて理解する
• データバインディングを含む、完全に動作するサンプルを確認する

データラベル

📄 参照： references/data-labels.md

ユーザーが次のことを行う場合に参照します。

• ピラミッドのセグメントにデータラベルを表示する
• ラベルをカスタマイズするために PyramidDataLabelSettings を構成する
• ラベルの配置（Auto、Inner、Center、Outer）を制御する
• ラベルのコンテキストを設定して、X 値または Y 値を表示する
• フォント、色、背景、境界線、角の半径でラベルのスタイルを設定する
• 系列のパレット色をラベルの背景に使用する
• 余白を適用し、ラベルの外観をカスタマイズする

凡例

📄 参照： references/legend.md

ユーザーが次のことを行う場合に参照します。

• セグメント情報を表示するために ChartLegend を追加、構成する
• 凡例ラベルのスタイル（フォント、色、サイズ、属性）をカスタマイズする
• 凡例アイコンの種類を設定し、アイコンの外観をカスタマイズする
• 凡例の位置（Top、Bottom、Left、Right）を設定する
• オフセット位置を指定したフローティング凡例を作成する
• 凡例のタップで系列の表示切り替えを有効にする
• ItemsLayout で凡例のレイアウトをカスタマイズする
• カスタムの凡例項目テンプレートを使用する
• LegendItemCreated イベントを処理する
• 凡例ビューの最大サイズ要求をオーバーライドする

ツールチップ

📄 参照： references/tooltip.md

ユーザーが次のことを行う場合に参照します。

• ホバー時にセグメント情報を表示するツールチップを有効にする
• ツールチップをカスタマイズするために ChartTooltipBehavior を構成する
• ツールチップの外観（背景、フォント、色、余白）を設定する
• ツールチップの表示時間を制御する
• 高度な UI 向けにカスタムのツールチップテンプレートを作成する
• ツールチップの内容を項目データのプロパティにバインドする

外観とカスタマイズ

📄 参照： references/appearance-customization.md

次の操作が必要な場合：

• カスタムパレットのブラシをピラミッドのセグメントに適用する
• グラデーションの塗りつぶし（LinearGradientBrush、RadialGradientBrush）を使用する
• Linear モードと Surface モードのピラミッドを切り替える
• モードの違い（高さベースと面積ベース）を理解する
• GapRatio プロパティでセグメント間の間隔を調整する
• ビジュアルスタイルのベストプラクティスを実装する
• セグメントに高度なグラデーション効果を作成する

方向とビジュアル効果

📄 参照： references/orientation-and-effects.md

次の操作が必要な場合：

• グラフの方向を垂直から水平に変更する
• リキッドグラスのビジュアル効果（iOS/macOS .NET 10+）を実装する
• SfGlassEffectView を統合して、モダンな UI スタイルを適用する
• ツールチップでグラス効果を有効にする
• EffectType（Regular と Clear のグラス表示）を設定する
• 背景上でグラス効果を使用する際のベストプラクティスを適用する
• カスタムツールチップテンプレートで透明な背景を使用する

エクスポート

📄 参照： references/exporting.md

次の操作が必要な場合：

• ピラミッドグラフを画像（JPEG または PNG）としてエクスポートする
• SaveAsImage メソッドを使用してファイルにエクスポートする
• プラットフォーム固有の保存先を理解する
• Android と Windows Phone のファイル書き込み権限を設定する
• iOS の写真アルバムへのアクセス権限を設定する
• GetStreamAsync を使用してグラフをストリームとしてエクスポートする
• グラフのストリームを PDF、Excel、Word の各コンポーネントと統合する
• ImageFileFormat のオプションを処理する

アクセシビリティ

📄 参照： references/accessibility.md

次の操作が必要な場合：

• スクリーンリーダーにグラフのタイトル、ピラミッドのレイヤー、凡例項目を通知する
• 読み上げ形式（ピラミッドのレイヤー =「ラベル + 値」）を理解する
• プラットフォームごとのアクセシビリティを有効にする（TalkBack、VoiceOver、Narrator）
• キーボードでグラフ要素を操作する（Windows Narrator、macOS VoiceOver）
• ジェスチャーでグラフ要素を操作する（Android TalkBack、iOS VoiceOver）
• 意味のあるラベルを付けて、情報を適切に読み上げる