- Grafanaレンダリング画像によるChartの埋め込み
- Grafana HTTP APIとのインテグレーションによるChartの埋め込み
- Grafanaインテグレーション設定
- Chartへのリンクの生成
Grafanaチャートの埋め込み
GrafanaメトリクスはGitLab Flavored Markdownに埋め込むことができます。
Grafanaレンダリング画像によるChartの埋め込み
イシューにライブのGrafanaチャートを、直接リンクされたレンダリング画像として埋め込むことが可能です。
Grafana内の共有ダイアログは、以下のハイライトのようにリンクを提供します。
リンクをコピーし、Markdown にインライン HTMLとして image タグを追加します。 クエリパラメータは必要に応じて変更してください。例えば、&from=
と&to=
パラメータを削除するとライブチャートが表示されます。 以下は GitLab の公開ダッシュボードのライブチャートのマークアップ例です:
<img src="https://dashboards.gitlab.com/d/RZmbBr7mk/gitlab-triage?orgId=1&refresh=30s&var-env=gprd&var-environment=gprd&var-prometheus=prometheus-01-inf-gprd&var-prometheus_app=prometheus-app-01-inf-gprd&var-backend=All&var-type=All&var-stage=main&from=1580444107655&to=1580465707655"/>
このようにレンダリングされます:
Grafana HTTP APIとのインテグレーションによるChartの埋め込み
GitLab 12.5で導入されました。
各プロジェクトは1つのGrafanaインスタンスとのインテグレーションをサポートすることができます。 この設定により、ユーザーはGrafanaのパネルへのリンクをコピーし、GitLab Markdownフィールドに貼り付けることができます。 チャートはGitLabチャート形式でレンダリングされます。
Grafanaインスタンスから埋め込むための前提条件:
- データソースは Prometheus インスタンスでなければなりません。
- データソースはプロキシ可能でなければならないので、HTTPアクセス設定は
Server
に設定する必要があります。
Grafanaインテグレーション設定
- Grafanaで管理者レベルのAPIトークンを生成します。
- GitLabプロジェクトで、Settings > Operations > Grafana Authenticationに移動します。
- インテグレーションを有効にするには、「アクティブ」チェックボックスをオンにします。
- Grafana URL」には、GrafanaインスタンスのベースURLを入力します。
- API Token」には、先ほど生成したAdmin API Tokenを入力します。
- 変更を保存]をクリックします。
Chartへのリンクの生成
- Grafanaで、パネルを埋め込みたいダッシュボードに移動します。
- ページの左上で、Chartのクエリに必要な各変数の特定の値を選択します。
- Grafanaでは、パネルのタイトルをクリックし、共有(Share)をクリックしてパネルの共有ダイアログをリンクタブに開きます。_ダッシュボードの_共有パネルを代わりにクリックすると、GitLabはダッシュボードの最初にサポートされているパネルを埋め込もうとします(利用可能な場合)。
- PrometheusクエリがGrafanaのカスタムテンプレート変数を使用する場合、「テンプレート変数」オプションがOnに切り替わっていることを確認してください。 Grafanaグローバルテンプレート変数のうち、現在サポートされているのは
$__interval
、$__from
、$__to
のみです。 「現在の時間範囲」オプションをOnに切り替えて、チャートの時間範囲を指定します。 そうでない場合、デフォルトの範囲は過去8時間になります。 - コピー]をクリックすると、URLがクリップボードにコピーされます。
- GitLab の Markdown フィールドに URL を貼り付けて保存します。 Chart がレンダリングされるまで少し時間がかかります。