skip to content
barorin&?

dash_tableでハイパーリンクを付ける方法

/ 1 min read

はじめに

Dash v1.8.0 で実装された Markdown によって、dash_table 内でハイパーリンクを使うことができるようになりました。
📣 Dash v1.8.0 release - dcc.Graph updates, markdown & link support in DataTable, and more - Dash Python - Plotly Community Forum

内容

import dash
from dash import html
from dash import dash_table
import pandas as pd

df = pd.DataFrame(['パンダ', 'ペンギン', 'ネコ'], columns=['検索データ'])

# ハイパーリンク列の追加
# Markdownのハイパーリンク記法 [表示したいテキスト](URL)の形にする。
df['Google検索'] = '[検索](https://www.google.com/search?q=' + df['検索データ'] + ')'

app = dash.Dash(__name__)

app.layout = html.Div(
    [
        dash_table.DataTable(
            columns=[
                {
                    'name': 'Google検索',
                    'id': 'Google検索',
                    'type': 'text',
                    'presentation': 'markdown' # presentationをmarkdownにする
                }
            ],
            data=df.to_dict('records')
        )
    ]
)

if __name__ == '\_\_main\_\_':
    app.run_server(debug=True)