Heroku Advent Calendar 20187日目の記事です。
PythonにDashという可視化ライブラリがあります。ウェブアプリの形で作られてよいのと、すごい綺麗にグラフがでてきて、しかも物凄い複雑なことが簡単にできて良いライブラリです。詳しくはギャラリーをご覧ください。
しかし、いざ共有となり、サーバーに上げてという段階となったときに、ウェブを全く触ったことのない私。どうやったらええんや状態になりました。VPSは契約しているが、色々読んでいるとめんどくさいことこの上なさそうで、ちょっとやりたくないなぁと思いました。しかし、ローカルでだけ動かしているなんて宝の持ち腐れ感しかありません。
そんなときに、Dashのドキュメントをつらつら読んでいると、deploymentのところにherokuを使えば簡単さ的なことが書いてました。ちょうどyコンビネータを読んでherokuに関心があった私。早速試してみることにしました。
その結果は・・・最後まで見てほしいですが、超簡単にアップできたので、VPSを解約してherokuへの乗り換えを考えています。
その前に
gitとheroku CLIが必要となります。
書いているとおりにインストールしましょう。
アプリケーションを作りローカルで動かしましょう
ローカルで動いたら、まぁ大丈夫ですが、ちょっとコードを足す必要があります。
herokuで動かそう
さてここからが本番です。といっても先程のDashのdeploymentのページに書いているとおりですが。
①ファイルの設定
まず動かしたいファイルの名前をapp.pyにします。これ以外の名前で動かしたらエラーになったので、他の名前で動かしたい場合何が設定の変更がいるのかもしれません。とりあえず、動かしたいだけなので、app.pyで行きます。
ポイントとなるのはapp.pyファイルにimport osとserver = app.serverを付け加えておくことです。
これをファイルに入力していないと動きませんでした。
②.gitignoreファイルを作ります。
あんまりわかってないのでパスでお願いします。
③Procfileファイルを作る
ドキュメント通り。
web: gunicorn app:server
④requirements.txtファイルを作る
ドキュメントはpip freezeでrequirements.txtを作っていますが、あいにく私はAnacondaを使っているので、地味に自分で入力しました。
dash dash-core-components dash-html-components plotly pandas numpy gunicorn lxml
⑤herokuをイニシャライズして、ファイルをgitにaddし、デプロイします。
$ heroku create my-dash-kyoto #1 $ git add . $ git commit -m 'hogehoge' $ git push heroku master $ heroku ps: scale web:1
これでうまく行くと、https://my-dash-kyoto.herokuapp.comでアプリが動きます。簡単!
⑥ファイルを更新した場合
またファイルなどをアップデートした場合、以下のように再デプロイすると同じアドレスで動きます。
$ git status $ git add . $ git commit -m 'kaetayo' $ git push heroku master
herokuに上げたアプリ
今回は京都市の出しているオープンデータを使って京都の宿泊施設情報を可視化してみました。
横にあるlegendを押すとその押した年代のマーカーが消えるようになっています。2010年を押すと、多くのマーカーが消えるのが面白いですね。それもそのはず、ここ3年で京都の宿泊所数は3倍に増えているようですwインバウンドすごい。私も乗りたかったなぁ・・・
アプリはここから見られます。
pythonのコードは以下のようになっています。<==矢印部分がherokuで動かす際に必要なおまじないです。
import pandas as pd import numpy as np import dash import dash_core_components as dcc import dash_html_components as html import plotly.graph_objs as go import os <==== 付け加え df = pd.read_csv('kyoto_hotel_comp1.csv', index_col=0) mapbox_access_token = "mtoTQ" app = dash.Dash(__name__) server = app.server <==== 付け加え app.layout = html.Div(children=[ html.H1(children="Kyoto Hotel Map"), dcc.Graph( id = 'kyoto-hotels', figure = { 'data':[ go.Scattermapbox( lat = df[df['age']== i]['ido'], lon = df[df['age']== i]['keido'], mode = 'markers', marker = dict( size=9 ), text = df[df['age']== i]['hotel_name'], name = str(i), ) for i in df['age'].unique() ], 'layout': go.Layout( autosize=True, hovermode='closest', mapbox = dict( accesstoken=mapbox_access_token, bearing = 0, center = dict( lat=np.mean(df['ido']), lon=np.mean(df['keido']) ), pitch = 90, zoom=10, ), height=600 ) } ) ]) if __name__=='__main__': app.run_server(debug=True)