Output HTML と Output Markdown

Vertex AI Pipelines には、パイプライン ジョブの結果を評価する事前定義された可視化タイプのセット（Metrics、ClassificationMetrics など）が用意されています。ただし、多くの場合、カスタムの可視化が必要になります。Vertex AI Pipelines では、カスタムの可視化アーティファクトを出力する 2 つの主要な方法（Markdown ファイルと HTML ファイル）が提供されます。

必要な依存関係をインポートする

開発環境で、必要な依存関係をインポートします。

from kfp import dsl
from kfp.dsl import (
    Output,
    HTML,
    Markdown
)

Output HTML

HTML ファイルをエクスポートするには、Output[HTML] アーティファクトを使用してコンポーネントを定義します。また、アーティファクトのパスに HTML コンテンツを書き込む必要もあります。この例では、文字列変数を使用して HTML コンテンツを表します。

@dsl.component
def html_visualization(html_artifact: Output[HTML]):
    public_url = 'https://user-images.githubusercontent.com/37026441/140434086-d9e1099b-82c7-4df8-ae25-83fda2929088.png'
    html_content = \
      '<html><head></head><body><h1>Global Feature Importance</h1>\n<img src="{}" width="97%"/></body></html>'.format(public_url)
    with open(html_artifact.path, 'w') as f:
        f.write(html_content)

Google Cloud コンソールでの HTML アーティファクト:

コンソールでの HTML アーティファクト

Google Cloud コンソールの HTML アーティファクト情報:

コンソールでの HTML アーティファクト情報

[HTML の表示] をクリックして、新しいタブで HTML ファイルを開きます。

コンソールでの HTML アーティファクト情報

Output Markdown

Markdown ファイルをエクスポートするには、Output[Markdown] アーティファクトを使用してコンポーネントを定義します。また、Markdown コンテンツをアーティファクトのパスに書き込む必要もあります。この例では、文字列変数を使用して Markdown コンテンツを表します。

@dsl.component
def markdown_visualization(markdown_artifact: Output[Markdown]):
    import urllib.request

    with urllib.request.urlopen('https://gist.githubusercontent.com/zijianjoy/a288d582e477f8021a1fcffcfd9a1803/raw/68519f72abb59152d92cf891b4719cd95c40e4b6/table_visualization.md') as table:
        markdown_content = table.read().decode('utf-8')
        with open(markdown_artifact.path, 'w') as f:
            f.write(markdown_content)

Google Cloud コンソールの Markdown アーティファクト:

コンソールでの Markdown アーティファクト

Google Cloud コンソールでの Markdown アーティファクト情報:

コンソールでの Markdown アーティファクト情報

パイプラインを作成する

HTML アーティファクトや Markdown アーティファクトでコンポーネントを定義したら、そのコンポーネントを使用するパイプラインを作成して実行します。

@dsl.pipeline(
    name=f'metrics-visualization-pipeline')
def metrics_visualization_pipeline():
    html_visualization_op = html_visualization()
    markdown_visualization_op = markdown_visualization()

パイプラインの実行を送信すると、 Google Cloud コンソールでこの実行のグラフを表示できます。このグラフには、対応するコンポーネントで宣言した HTML アーティファクトと Markdown アーティファクトが含まれます。これらのアーティファクトを選択して、詳細な可視化の結果を表示できます。