Dashアプリ上で化学構造描画ソフトJSMEを使用する

概要

化学のデータを扱うためには化学構造を効率的に描画し、それを元にSMILESするためのツールが欠かせませない。
Dashの拡張ライブラリを dash_bio.Jsme を使うことで、Dashアプリ上で化学構造描画ソフトJSMEを使用できるみたいなので、構造式を書くと自動的にSMILESがアウトプットされ、}}SMILESが書かれると構造式が自動的に描画される** WEBアプリを作ってみた。

やり方

1. 環境構築

anacondaの環境を作って必要なライブラリを入れる

conda create -n jsme-dash python=3.9
conda activate jsme-dash
pip install dash
pip install dash_bio
pip install dash-bootstrap-components

コード

以下コードを書くだけ。

python main.py

でアプリを起動し、ページ(http://127.0.0.1:8050/) にアクセスするとJSMEが使える。
(jsmeで入力されたsmiles情報の要素名を"eventSmiles"にしないといけないらしい)

import dash
import dash_bio as bio
import dash_bootstrap_components as dbc
from dash import html
from dash.dependencies import Input, Output

app = dash.Dash(__name__)

# JSMEのパートとSMILESをインプットするパートを作成
app.layout = html.Div([
    bio.Jsme(id='jsme'),
    dbc.Input(id='smiles-input', type='text', placeholder='Enter SMILES...', value=None),
])

# JSMEで構造を描くとSMILESをアウトプットするコールバック
@app.callback(
    Output('smiles-input', 'value'),
    Input('jsme', 'eventSmiles')
)
def update_smiles_output(smiles):
    return smiles

#SMILESを入力すると構造式を描くコールバック
@app.callback(
    Output('jsme', 'smiles'),
    Input('smiles-input', 'value')
)
def update_jsme(smiles):
    if smiles is not None:
        return smiles
    else:
        return ''

# アプリの起動
if __name__ == '__main__':
    app.run_server(debug=True)

起動している様子

JSME_SMILES.png

以上

参考

関連書籍