Blow Up by Black Swan

Python-plotly.pyの使い方

前回の投稿から2週間ほど時間が空いてしまいましたが、その間にDashとその基礎となるplotly.pyの使い方を勉強していました。今回は、そのうちplotlyの使い方についてまとめてみようと思います。本命はDashというplotlyを下敷きにしたWEBフレームワークですが、それについては今度記事にしようと思います。

1. plotly.pyとは

plotly.pyとはJavaScriptのオープンソースライブラリであるplotly.jsをpythonでも使えるようにしたものです。基本的にmatplotlibと同じようにグラフ化など、データの可視化に特化しています。APIを介することで、python環境下で、pythonコードのみでplotly.jsのような可視化が可能です。

もとは、カナダの企業が出していたものですが、現在はオープンソース化しています。現在も、有料プランと無料プランが存在します。また、オフラインモードとオンラインモードがあります。オンラインモードでは、グラフをweb上で公開したり保存したりできるようです。普通に使う分にはオフラインで十分だと思います。

開発環境

今回、plotlyの学習環境は以下です。

  • PC: Macbook
  • python: Jupyter labを利用
  • plotly: 最新版をインストール

インストールは他のモジュール同様にpipでできます。本旨とはそれますが、pythonの勉強では、jupyterはかなり使い勝手が良いなと思います。まだ、jupyternotebookが主流だと思いますが、jupyterlabも現時点で十分使えますので、学習ノートとして利用して頂ければと思います。

参考: jupyterlabでplotlyのグラフを表示させるための準備

なお、jupyterlabでplotlyのグラフを表示させるには、事前に「@jupyterab/plotly-extension」という拡張機能を入れる必要があります。これを入れるためには、ターミナルで以下のようなコマンドを入力するだけです。

~$ jupyter labextension install @jupyterlab/plotly-extension

ただし、上記はnode.jsとそのバージョン管理ツール(npmが主流のようです)に依存しているため、その2つが入っていないと、エラーが起こるか、インストールがいつまでたっても完了しない、またはインストールできてもグラフが表示されない、のどれかになる可能性があります(記憶が曖昧ですいません)。そのため、以下のサイトを参考にnode.jsとそのバージョン管理ツールをインストールして頂ければと思います。

参考サイト

私はその2つをインストールしても、拡張機能のインストールはうまくいかなかったのですが、node.jsとその管理ツールを何度かインストールし直してうまく表示されるようになりました。私見ですが、node.jsだけインストールするだけで良いような気がします。確証がなく、日本語だと情報が少ないので、英語で調べて頂くのが良いかなと思います。

2. plotly.pyの使い方

ここからはplotly.pyの使い方についてです。基本的にplotlyの使い方は、plotly.pyで定義されたトレースオブジェクトを作成し、それをグラフを表示させるメソッド(iplotメソッドなど)に渡すという流れになります。

2-1. トレースとは

トレースとは、plotlyの公式ドキュメント上では以下のように説明されています。

A trace is just the name we give a collection of data and the specifications of which we want that data plotted. Notice that a trace will also be an object itself, and these will be named according to how you want the data displayed on the plotting surface.

意訳すると、trace(トレース)はplotlyが独自に定義し、名付けた概念のことであり、具体的にはプロットされるデータの集合とその仕様について記載したオブジェクトで、データのプロットの仕方に応じてそのオブジェクト名が変わるということです。オブジェクト名が変わるという部分をもう少し噛み砕くと、散布図(折れ線グラフも含む)を描く場合には”Scatter”オブジェクト、棒グラフを描く場合には”Bar”オブジェクトといったように、plotlyでは描きたい種類のグラフ、図に応じて、オブジェクトを用意しているということで、traceというのはこの具体的なオブジェクトを抽象化した呼び名ということです。今回は、Scatterオブジェクトのみを利用しています。

2-2. オフライン(jupyter)での使い方

オフライン、今回はjupyterでの利用を想定していますが、この場合の事前準備が必要となります。使用する前に、モジュールの呼び込みと併せて、jupyterとplotlyを接続させる必要があります。以下のコードを一番最初に実行します。

import plotly.offline as offline
offline.init_notebook_mode(connected=False)

init_notebook_modeの引数は、JavaScriptのコードをオンラインから取得するかどうか指定するもので、Trueにすると取得するように設定されます。

2-3. plotlyのコード例と使い方

plotlyによるグラフ実行までの構造は以下ののようになります。

・グラフ表示メソッド
 plotly.offline.iplot(figure)
-> figure = go.figure(data=trace_obj, layout=dict_obj)のオブジェクト

実行メソッド(offline.iplot)の中に、figureオブジェクト(traceオブジェクトの大元のようなもの)を渡し、figureオブジェクトにはtraceオブジェクトと辞書型を渡すという構造です。具体的なコードは以下になります。今回、大数の法則を可視化したグラフを具体例として作ってみました。1回の試行は、それぞれ独立し、コインの表が出るか裏が出るかはわからないが、何回も同様の試行を繰り返せば、1/2に収束するというものです。

#データ型の作成用コード
import pandas as pd
import numpy as np
coin = [1, 0]
x = 1000
index = pd.RangeIndex(start=1, stop=x+1)
columnA = np.random.choice(coin, size=x)
columnB = columnA.cumsum()
df = pd.DataFrame(({'A' : columnA,
                  'B' : columnB}),
                 index = index)
columnC = []
index_list = list(index)
columnB_list = list(columnB)
for i in range(x):
    columnC.append(columnB[i]/index_list[i])
join_df = pd.DataFrame({'C':columnC}, index=index)
df2 = pd.merge(df, join_df, right_index=True, left_index=True)

#plotlyの実行コード
import plotly
import plotly.offline as offline
import plotly.graph_objs as go
trace = go.Scatter(x = df2.index  #X軸
                   ,y = df2["C"]  #Y軸
                   ,mode="markers+lines"  #グラフの表示の仕方
                   ,text=df2.index.map(str)+"回目"  #グラフに合わせた時に表示する事項
                   ,name="表の確率"
                   ,marker={'symbol':17, 'opacity':0.5, 'size':2, 'color':'yellow', 'line':{'color':'blue', 'width':2}}
                   )
ex_data = [trace] #traceスオブジェクトを含むリスト
ex_layout = {'title': 'コインで表が出る確率が1/2に収束していく図(大数の法則)','width':900, 'height': 450}
figure = go.Figure(data=ex_data,layout=ex_layout)  #data->list型(traceオブジェクトを含む), layout->dict型
offline.iplot(figure)

コードを見ると非常に直感的な作りになっているのがわかると思います。xとyでデータを指定し、modeでグラフの基本的な作りを、markerで点と線の表記を指定しています。それぞれのキーワード引数は、デフォルト値が設定されているため、細かく指定しなくても大丈夫です。さらに、traceオブジェクトに当たるこのScatterオブジェクトをリストの一要素にし、figureオブジェクトに入れます。

figureオブジェクトについては、traceオブジェクトの他にグラフのより外観的なところ(グラフタイトルなど)を指定するlayoutも併せて含めることができます。layout自体は指定しなくても大丈夫です。そして、最後にこのfigureオブジェクトを実行メソッドの引数に渡してあげて、コードを実行するとグラフが表示されます。

チャートイメージ図

引数などを色々といじって見ると理解が捗ると思います。

3. まとめ

今回は、plotlyについてですが、本命はplotlyをベースにしたwebフレームワークDashですので、次回はこの記事について執筆したいと思います。

読んで頂きありがとうございます。