システムトレード

FXバックテストのためのdash.plotly環境の作成

FXのバックテストをシミュレーションと見える化含めてPythonでやりたいなと思い、試行錯誤してきました。

シミュレーションはPythonスクリプトと、高速ループにはnumba使ったりしていけば良さそう。

見える化をずっと悩んできました。過去の記事を見るとわかると悩んだ履歴がわかりますが、

  • シミュレート結果をMT4へ連携。連携の操作が面倒なのと、開発環境はMacなのでMT4への連携が難しい。Parallelsを使うか。。。
  • Jupyter上にplotlyでプロット。しかし、インタラクティブな操作に弱い。
  • 本格的にReactなど使ってWebアプリを作る。

悩んで調べてるうちに、dash.plotlyなるものを見つけました。
PythonでWebアプリがかけるという、かつグラフはplotlyに対応しているので、私にピッタリだったりで、良い技術にたどり着きました。

グラフ以外にも、テキストやドロップダウン、テーブルなど簡単なWeb画面も作れたりするので、小規模なシステムであればJavaなんか使わずにPythonだけで作れてしまうんではと思っています。

この記事では、dash.plotyの環境構築と簡単なWeb画面のサンプルのコードを紹介します。

dash.plotlyのインストール

pipでインストールできます。

$ pip3 install dash==1.3.0 --user

これだけ。

Hello World Step1 表示するだけ

まずは、”Hello World”と表示するだけのページを作ってみます。

コードの内容は下記です。

  • Dashアプリを作る dash.Dash()
  • ページレイアウトを作る crete_layout
  • サーバを立ち上げる app.run_server
import dash
import dash_html_components as html

app = dash.Dash(__name__)

def create_layout():
    return html.Div("Hello World")

app.layout = create_layout()

if __name__ == '__main__':
    app.run_server(debug=True, host='0.0.0.0', port=8050)

独自なのはcreate_layoutです。
ここでは、子要素が”Hello World”のDivタグを作っています。
DivやInputタグなどネストして、レイアウトを作れます。
Step2では、Divとボタンを子要素とするDivのレイアウトを作ります。

あとは起動するだけです。

$ python3 sample.py

Hello World Step2 イベント処理する

ボタンを押したら、Hello Worldと表示するサンプル画面を作ります。

コードの内容は下記です。

  • 無い要素に対してコールバック登録できるように suppress_callback_exceptions=True
  • ボタンとDivタグのレイアウトを作る crete_layout
  • ボタン押下のイベント登録と処理 register_callback
import dash
import dash_html_components as html
from dash.dependencies import Input, Output

app = dash.Dash(__name__)
app.config.suppress_callback_exceptions = True

def create_layout():
    return html.Div([
        html.Button("SHOW", id="sample_show"),
        html.Div(id="sample_label")
    ])

@app.callback(
    Output("sample_label","children"),
    [Input("sample_show", "n_clicks")]
)
def register_callback(n_clicks):
    if n_clicks == None:
        return "(init)"
    else:
        return "Hello World"

app.layout = create_layout()

if __name__ == '__main__':
    app.run_server(debug=True, host='0.0.0.0', port=8050)

create_layoutでは、ボタンとDivをネストしたDivを作っています。
ボタンを押したときのコールバックで使えるように両方ともidを振っています。

register_callbackでは、入力はボタンのn_clicks。n_clicksは画面表示したあとのボタンのクリック回数です。
出力は用意したDivタグです。戻り値がDivの子要素(children)に入るよう宣言しています。
また、n_clicksは初期化でも呼ばれてしまうので、数が入っているかチェックしています。

callバック登録時には、まだcreate_layoutが呼ばれていないので、宣言したidの要素がないのでエラーとなってしまいます。
無い要素に対してコールバック登録できるように suppress_callback_exceptions=Trueを設定しています。

まとめ

dash.plotlyのHello Worldのコードを紹介しました。

すごいシンプルな画面なのですが、PythonだけでWeb画面ができました。

また、create_layoutなどはWebアプリでReact使っている人とか馴染みやすいのではと思います。
dash.plotlyはJavaScript部分はReactのフレームワークを使っているためです。

整理すると

  • レイアウトを作る create_layout : Reactライク
  • イベント処理する register_callback : コールバック登録してイベント処理する

です。基本、これを理解できれば、複数画面や複雑な画面レイアウトとイベント処理をつなげてWebアプリを作っていけます。

ABOUT ME
crz33
アラフォーのシステムエンジニアです。 それなりの規模のSI会社でいろんなプロジェクトを渡り歩き、 立場もプログラマー、アーキテクト、プロジェクトリーダーと経験してきました。 今はプロジェクトマネージャーとして活躍?中です。 早期リタイアを目指し、アフィリエイトで稼げないかと奮闘中です。

COMMENT

メールアドレスが公開されることはありません。