Goodな生活

経済学修士→環境コンサル→データサイエンス

【Python】Plotly で作成したグラフをはてなブログで表示する

最近流行り(?)のPlotly社のパッケージを使って作成したグラフをはてなブログに埋め込みます。

Plotly Chart Studioのアカウント登録

Cart Studioのページよりアカウント登録を行います。ページ右上部の「Sign Up」を押します。

f:id:good_na_life:20211018220343p:plain

所属組織のメールアドレス(organization email)を入力欄がありますが、ここにはgmailを入力しても問題ありませんでした。しばらくするとconfirmのメールが届きます。無事confirmが完了すると、アカウントの登録が完了です。ここで登録したusernameは後にploylyのグラフを出力する際に使用します

API keyの取得

アカウントの登録後、Chart StudioにSign In するとページ右上部にユーザー名が表示されます。ユーザー名のカーソルを合わせ「Settings」→「API Keys」と進み、「Regenerate Key」を押すとAPI Keyが表示されます。

f:id:good_na_life:20211018221159p:plain

PythonでPlotlyグラフの作成

Pythonでコードを書いてみます。データはインタラクティブな可視化事例では有名な、FACTFULLNESSハンス・ロズリング氏によるgapminderを用います。gapminderは一人あたりGDPと平均寿命の相関を示す統計でる。

#ライブラリのインストール
pip install plotly
pip install chart-studio

#ライブラリの読み込み
import plotly.express as px
import plotly.graph_objs as go
import chart_studio
import chart_studio.plotly as py

#グラフの作成
gapminder = px.data.gapminder()
fig = px.scatter(gapminder.query("year==2007"), x="gdpPercap", y="lifeExp", size="pop", color="continent",
           hover_name="country", log_x=True, size_max=60)

# usernameとAPI keyを指定
username = 'your username' 
api_key = 'your api key' 
chart_studio.tools.set_credentials_file(username=username, api_key=api_key)

# chart studioに出力
py.plot(fig, filename = 'gapminder', auto_open=True)

最後のコードを実行すると、自動的にchart studioが立ち上がり、作成したグラフが表示されます。

inframeでコピー&ペースト

画面右上のpublic→Share→Embed→inframeに進み、表示されるコードをコピーします。
f:id:good_na_life:20211018225850p:plain

コピーしたコードを、ブログの編集画面に貼り付けます。ちなみにこのブログは「はてな記法」で作成しています。

ひとまずはてなブログでも問題なくplotlyを表示させることができました。読んでいただいてありがとうございました。