Azure DevOps 用の Analytics ウィジェットを作成する

Azure DevOps Services | Azure DevOps Server 2022 - Azure DevOps Server 2019

独自の Analytics ウィジェットを作成して、Azure DevOps の ダッシュボード に表示できます。 github の ウィジェットの例では、次の例を示します。

• 作業項目の状態に関連付けられている傾向線をレンダリングする方法
• データセットに対してクエリを実行し、ユーザーがウィジェット構成ビューを使用して構成する方法
• ウィジェットをビルドして Azure DevOps マーケットプレースに発行する方法

この情報を使用すると、独自の Analytics ウィジェットを作成できます。

ウィジェットビュー

手記

Analytics サービスは、すべての Azure DevOps Services で自動的に有効になり、運用環境でサポートされます。 Power BI 統合 と、Analytics サービスの OData フィード へのアクセスが一般公開されています。 お使いいただき、フィードバックをお寄せください。 使用可能なデータはバージョンによって異なります。 サポートされている最新バージョンが v2.0され、最新のプレビュー バージョンが v4.0-preview。 詳細については、OData API のバージョン管理 を参照してください。

前提 条件

カテゴリ	必要条件
アクセスレベル	プロジェクトメンバー - がです。 - 少なくとも 基本的な アクセス。
アクセス許可	既定では、プロジェクト メンバーには Analytics にクエリを実行してビューを作成する権限があります。 サービスと機能の有効化と一般的なデータ追跡アクティビティに関するその他の前提条件の詳細については、「アクセス許可と、Analyticsにアクセスするための前提条件」を参照してください。

この記事の例では、ダッシュボード、グラフ作成、分析の各トピックの基本を説明する、既製のウィジェットを提供します。 次のドキュメントでは、この例で示した詳細について詳しく説明します。

1. Azure DevOps ウィジェット拡張機能を作成し、Widget 拡張機能のサンプル を参照する
2. Azure DevOpsのチャートコントロールをレンダリングし、チャートを追加し、 を参照する
3. Analytics から OData にクエリを実行する

構成ビューを指定する

1. ビューの構成に使用される UI コントロールで必要 単純な分析クエリを実行します。
2. 構成 UIの状態の管理、ユーザー アクションに基づく更新、および Analytics クエリからの新しいデータを使用します。
3. TypeScript と React を使用して構成 UI をレンダリングします。

ウィジェット内でデータをレンダリングする

1. ユーザーが構成したクエリを POST 要求 として実行する
2. 分析からグラフ をレンダリング データを解釈する

次の手順

サンプルの複雑さを回避するために、運用ウィジェットに含める必要がある特定のテクノロジとプラクティスを省略しました。 github の ui-fabric-react サンプルでは、これらの詳細を実行するビルド プロセスが強調表示されています。

1. JavaScript のバンドルとコンテンツの縮小 - サンプル内の小さい緩いスクリプト ファイルのセットは、1 つのファイルに結合して縮小すると、はるかに迅速に読み込むことができます。
2. Fabric UI コントロール - Fabric UI コントロールは、React 用の豊富な構成 UI コンポーネントのセットを提供します。

関連記事

• Analytics とは
• 分析に基づくウィジェット