概要

Python を普段お使いになられている皆さんは、普段グラフを作成するときにどのようなライブラリをお使いでしょうか？

いろんな方がいろんなライブラリを駆使して Python でグラフを作成されていることと思います。

現在使用されているグラフ作成ツールで事足りているという方でも、Python で簡単にグラフを作成してみたいという方にとっても、今回は有益な情報かもしれません。

今回ご紹介する OSS はタイトルにもありますように、Python で超簡単におしゃれなグラフを作成することができる OSS「Dash」です。

Dash は、Python で記述されたモデルに対しクリック操作などを行えるダッシュボードインターフェースを提供するフレームワークで、Python によるデータ分析・解析を行う際に非常に有用なものと説明されています。

また、Dash は Plotly.js、React、Flask の上に構築されており、ドロップダウンやスライダー、グラフなどの最新の UI 要素を分析用の Python コードに直接結び付けることができるので、リアクティブな UI であるとも説明されています。

README によると「初めての Dash アプリを作成するまでに 5 分もかかりません！」とあるので、さっそく公式ドキュメントのチュートリアルに沿って使い方など学んでみましょう！

dash.plotly.com

利用手順

Dash のインストールは以下のコマンドより行えます。

pip install dash

dash.plotly.com

使用感

Dash の動作確認を行うため、以下のソースを app.py という名前で作成し、実行してみました。

# Run this app with `python app.py` and
# visit http://127.0.0.1:8050/ in your web browser.

from dash import Dash, html, dcc
import plotly.express as px
import pandas as pd

app = Dash(__name__)

# assume you have a "long-form" data frame
# see https://plotly.com/python/px-arguments/ for more options
df = pd.DataFrame({
    "Fruit": ["Apples", "Oranges", "Bananas", "Apples", "Oranges", "Bananas"],
    "Amount": [4, 1, 2, 2, 4, 5],
    "City": ["SF", "SF", "SF", "Montreal", "Montreal", "Montreal"]
})

fig = px.bar(df, x="Fruit", y="Amount", color="City", barmode="group")

app.layout = html.Div(children=[
    html.H1(children='Hello Dash'),

    html.Div(children='''
        Dash: A web application framework for your data.
    '''),

    dcc.Graph(
        id='example-graph',
        figure=fig
    )
])

if __name__ == '__main__':
    app.run_server(debug=True)

$ python app.py
...Running on http://127.0.0.1:8050/ (Press CTRL+C to quit)

見事グラフを簡単に描画することができていることが確認できました！

ソース自体も単純ですので、こちらのソースを参考にしながら思い思いのグラフを作成することができそうですね。

また、Dash には「ホットリロード」機能が含まれていて、ソース上で app.run_server(debug=True) を追記することで有効になるそうです。

ホットリロード機能はコード上に変更を加えると、Dash が自動的に変更を検知してブラウザ上で結果が自動更新してくるものなので、UI の修正を行いたいときなどはとても便利です。

さらにチュートリアルを読み進めていくと、Dash の UI を変更する具体的な方法について記載されています。

Dash ではブラウザ上でグラフを表示させる際、ダッシュ HTML コンポーネント dash.html が作成されるようですが、こちらのすべての HTML タグのコンポーネントクラスとすべての HTML の引数のキーワードを指定して、UI を独自にカスタマイズすることができるそうです。

以下のソースを参考にしてみてください。

# Run this app with `python app.py` and
# visit http://127.0.0.1:8050/ in your web browser.

from dash import Dash, dcc, html
import plotly.express as px
import pandas as pd

app = Dash(__name__)

colors = {
    'background': '#111111',
    'text': '#7FDBFF'
}

# assume you have a "long-form" data frame
# see https://plotly.com/python/px-arguments/ for more options
df = pd.DataFrame({
    "Fruit": ["Apples", "Oranges", "Bananas", "Apples", "Oranges", "Bananas"],
    "Amount": [4, 1, 2, 2, 4, 5],
    "City": ["SF", "SF", "SF", "Montreal", "Montreal", "Montreal"]
})

fig = px.bar(df, x="Fruit", y="Amount", color="City", barmode="group")

fig.update_layout(
    plot_bgcolor=colors['background'],
    paper_bgcolor=colors['background'],
    font_color=colors['text']
)

app.layout = html.Div(style={'backgroundColor': colors['background']}, children=[
    html.H1(
        children='Hello Dash',
        style={
            'textAlign': 'center',
            'color': colors['text']
        }
    ),

    html.Div(children='Dash: A web application framework for your data.', style={
        'textAlign': 'center',
        'color': colors['text']
    }),

    dcc.Graph(
        id='example-graph-2',
        figure=fig
    )
])

if __name__ == '__main__':
    app.run_server(debug=True)

$ python app.py

先ほどとは UI が変わっていることを確認できると思います。

上記の例では、html.Div と html.H1components のインラインスタイルを style プロパティで変更した例になります。

html.H1('Hello Dash', style={'textAlign': 'center', 'color': '#7FDBFF'})

本記事でチュートリアルを追うのはここまで（Hello Dash の部分まで）としますが、公式ドキュメントのチュートリアルページではまだまだ様々なグラフを描画するための方法について説明されていますので、興味のある方は一度ご覧になってみると良いかもしれません。

以下は、Dash でほかにどのようなグラフを作成できるのかの一例を載せておきます。

まとめ

今回は、Python で超簡単におしゃれなグラフを作成することができる OSS「Dash」を紹介しました。

実際に触ってみても、Python 上でとてもきれいなグラフを、少ないソースコードで作成できるため、とても使い勝手が良いなという印象を受けました。

今後 Python でグラフを作成する際は、ぜひこの「Dash」を使って作成しようという気になりました！

「月に 800,000 回ダウンロードされる」というのもうなずける気がしますね。

Downloaded 800,000 times per month, Dash is the original low-code framework for rapidly building data apps in Python, R, Julia, and F# (experimental).

本記事ではチュートリアルの一部で紹介された棒グラフだけしか実際に描画して紹介しませんでしたが、Dash ではそのほかにも様々なグラフを描画することができます。

公式ドキュメントには Dash を使ったグラフ集もあるので、そちらを参考にしながらグラフを作成してみるというのもいいかもしれませんね。