はじめに
どの会社にも組織構造があり、従業員は誰もが必要になる場面があります。新入社員は誰が誰に報告するのかを把握したい、マネージャーは隣の部署の体制を確認したい、人事部門はプレゼンテーション用に最新の組織図を手作業で描き直すことなく用意したい、といった場面です。ところが、スライドに描いた組織図は、誰かの役割が変わった時点で古くなってしまいます。
Vitextra Organizational Chart は、すでに運用しているディレクトリから組織図を自動的に作成することで、この問題を解決します。この Web パーツは、Microsoft Entra ID 内のすべてのユーザー プロファイルの上司 (manager) 属性を読み取り、会社の階層を SharePoint Online のページまたは Microsoft Teams 内にインタラクティブなツリーとして表示します。別途データ ソースを管理する必要はありません。ディレクトリで報告ラインが変更されると、組織図も一緒に更新されます。

この記事では、Web パーツの機能と、主な機能の連携について概要を説明します。具体的なセットアップ手順については KB10233. Organizational Chart Web パーツの追加と構成方法を、エンド ユーザー向けの手順については KB10234. Organizational Chart: エンド ユーザー向けクイック ガイドを参照してください。
ディレクトリから構築
この Web パーツは SharePoint Framework で構築されており、Microsoft Graph API を介して従業員データを取得します。テナントのアクティブなメンバー アカウントを上司との関係とともに読み込み、ツリー状に配置します。上司が別の従業員である人は、その従業員の子ノードとなり、以下同様に階層が構成されます。
組織構造は Manager フィールドから導き出されるため、組織図の品質はディレクトリの品質に直接左右されます。会社のトップを除くすべての従業員に上司が設定されていれば、組織図のルートは 1 つで、枝もすっきりとしたものになります。上司が割り当てられていない人が複数いる場合は、それぞれが組織図の最上部で個別のルートになります。
📝 注
ゲスト アカウントと外部ユーザーは含まれません。組織図には、組織のメンバー アカウントのみが表示されます。無効なアカウントは既定で非表示になり、ライセンスが割り当てられていないアカウントや役職のないアカウントも既定で除外されます。管理者は、Web パーツの設定でこれらのルールを変更できます。
従業員データは一度だけ読み込まれ、ブラウザーに最大 12 時間保持されます。そのため、ページを開き直したときの表示が速く、Microsoft Graph に余分な負荷もかかりません。組織図の上には最終更新時刻と、データを必要に応じて再読み込みする Refresh(更新)リンクが表示されます。従業員の写真とプレゼンス状態は遅延読み込みされ、実際に画面に表示されているカードに対してのみ読み込まれるため、数千人の従業員がいる組織でも組織図の応答性が保たれます。
2 つのチャート モード
この Web パーツでは、組織全体、または組織の一部のみを表示できます。
- Entire Company(会社全体)— 上司のいない従業員 (通常は CEO または経営陣) を起点に、その下の階層全体を表示します。イントラネットのホーム ページや「会社概要」セクションに適したモードです。
- Employees reporting to specific user(特定のユーザーに報告する従業員)— 選択した人を起点に、その人に直接または間接的に報告するすべての人を表示します。組織の一部の枝だけが関係する部署のサイトやチームのページに適したモードです。

どちらのモードでも、ページを開いたときに展開される階層のレベル数を 1 から 10 の範囲で選択できます。それより深いレベルは、訪問者が展開するまで折りたたまれたままになるため、大規模な組織図でも見やすさが保たれます。
レイアウトと従業員カード
組織図には 2 つのレイアウトがあります。
- Horizontal(横向き)— 上から下へ広がる従来型の組織ツリーです。訪問者は組織図をドラッグして移動したり、拡大や縮小をしたりできるため、幅の広いページ セクションやフル幅のレイアウトに適しています。
- Vertical(縦向き)— 各レベルが上司の下にインデントされて入れ子になった、コンパクトなリストです。横方向のスペースをあまり取らず、幅の狭い列やモバイル画面に適しています。

各従業員はカードで表されます。カードのサイズは 4 段階あり、名前だけを表示するコンパクトなカードから、写真と 3 行の情報を表示する大きなカードまで選択できます。これらの行に表示する属性は自由に決められます。ヘッダー、セカンダリ、ターシャリの各フィールドには、フル ネーム、役職、部署、メール アドレス、携帯電話、オフィスの所在地、市区町村、国、従業員 ID など、15 種類のプロファイル属性のいずれかを設定できます。部署のサイトでは役職と電話番号を表示し、オフィスのディレクトリでは所在地とメール アドレスを表示する、といった使い分けが可能です。
カードには、従業員の写真と、リアルタイムの Microsoft Teams プレゼンス インジケーター (連絡可能、取り込み中、退席中、応答不可、オフライン) も表示されるため、同僚は今が連絡するのに適したタイミングかどうかを確認できます。カードをポイントすると、連絡先の詳細や、チャットの開始、メールの送信などの操作を含む、標準の Microsoft 365 プロフィール カードが開きます。必要に応じて、各カードのバッジにその人の直属の部下の人数を表示することもできます。

組織図の操作
組織図の上にあるツール バーには、大規模な組織構造の中を移動するために必要な機能がすべて用意されています。
- Expand all(すべて展開)と Collapse all(すべて折りたたむ)— ツリー全体を 1 回のクリックで開いたり閉じたりします。
- Zoom in(拡大)、Zoom out(縮小)と、現在の拡大率 (20% から 200%) をパーセントで表示します。さらに、組織図全体がページの幅に収まる倍率を自動的に選択する Fit to screen(画面に合わせる)と、100% と元の位置に戻す Reset view(表示をリセット)があります。Ctrl キー (Mac の場合は ⌘ キー) を押しながらマウス ホイールをスクロールしても組織図を拡大縮小できます。キーを押さずにスクロールした場合は、通常どおりページがスクロールします。
- Find me(自分を検索)— サインインしているユーザーを階層内で探し、その上にいる上司の連なりを展開して、そのユーザーのカードを強調表示し、表示位置までスクロールします。「この組織の中で自分はどこにいるのか」にすぐ答えてくれる機能で、新入社員に人気があります。
- Export(エクスポート)— 組織図をファイルとして保存します (後述)。
個々の枝の展開と折りたたみは、各カードの下にあるシェブロンで行います。シェブロンはキーボードでも操作できます。
検索とフィルター
組織図の上にある検索ボックスでは、入力に合わせてツリーが絞り込まれます。すべての従業員の名前、役職、部署、メール アドレス、従業員 ID、市区町村、都道府県、国が検索対象です。一致したカードは強調表示され、それらを含む枝は自動的に展開されるため、検索結果が折りたたまれたノードの中に隠れることはありません。
管理者向けに、Web パーツのプロパティ ウィンドウには Filter(フィルター)セクションがあります。クエリ ビルダーを使用すると、And/Or のロジックと、is equal to(等しい)、contains(含む)、begins with(で始まる)、contains data(データを含む)、およびそれらの否定などの演算子を使って、任意のカード属性に対する条件を組み合わせることができます。たとえば、2 つの部署の従業員のみを表示する、役職に特定の語句を含むサービス アカウントを除外する、といった使い方ができます。さらに、3 つのクイック トグルで、ライセンスのない従業員、部署が空白の従業員、役職が空白の従業員を除外できます。
💡 ヒント
フィルターの典型的な使い方は、1 つの部署をその部署専用のサイトに表示することです。具体的な例については、KB50026. Organizational Chart をフィルターして特定の部署を表示する方法を参照してください。
PDF と JPEG へのエクスポート
組織図は、1 回のクリックで PDF ドキュメントまたは JPEG 画像にエクスポートできます。エクスポートでは、たまたま画面に表示されている部分だけでなく、すべてのルートと、現在展開されているすべての枝を含むツリー全体が常に取り込まれます。PDF のページの向きは、組織図の縦横比に合わせて自動的に選択されます。2 つの形式のうち、訪問者に提供する形式は管理者が決定します。
Microsoft Teams
Organizational Chart は Microsoft Teams アプリとして提供されます。個人用アプリとしてインストールすると、すべての従業員が Teams のサイドバーから会社の組織図を開けます。チャネルのタブとして追加すると、チームがいつでも自分たちの組織構造を参照できます。データ、レイアウト、操作は、SharePoint ページ上のものとまったく同じです。
Teams では、管理者が現在の設定をテナント全体の既定値として保存できます。これにより、個人用アプリのすべてのユーザーが、自分で設定することなく、同じように構成された組織図を表示できます。

テーマと言語
この Web パーツは、配置されているページ セクションの配色バリエーションを含め、SharePoint サイトのテーマに従い、Teams クライアントに合わせてダーク モードに切り替わります。フル幅のセクションにも対応しており、完全にレスポンシブです。
ユーザー インターフェイスは 34 言語で利用でき、SharePoint サイトまたは Teams クライアントの言語に基づいて自動的に選択されます。
システム要件
| プラットフォーム | SharePoint Online (Microsoft 365) |
| ホスト | SharePoint モダン ページ、フルページ アプリ、Microsoft Teams の個人用アプリとチャネル タブ |
| データ ソース | Microsoft Graph 経由の Microsoft Entra ID |
| インストール | テナントのアプリ カタログ経由の SPFx パッケージ (.sppkg) |
| API のアクセス許可 | Directory.Read.All、User.Read.All、Presence.Read.All (Microsoft Graph) |
| ライセンス | テナントごとに 1 ライセンス。ユーザー数は価格に影響しません |
❗ 重要
Organizational Chart はクラウド製品であり、SharePoint Server (オンプレミス) 環境はサポートされていません。
💡 ヒント
Web パーツを環境にデプロイするには、KB10035. クラウド ベースの製品のインストールを参照してください。ページに追加して構成するには、KB10233. Organizational Chart Web パーツの追加と構成方法を参照してください。