Dash_bio JSME callbacks

Dash Python
1

I want to build a Dash app which contains the JSME object provided in the dash_bio library. Once the user has created their molecule in the JSME designer space, I want to be able to pull the SMILES string of the created molecule into a variable in a callback, which can then be used for other downstream purposes.

I haven’t found any information on callbacks for the JSME object here.

Has anyone been able to use a callback for the JSME object?

2

Hello @deepa-shalini welcome to the community.

I’ve never worked with this component and right now I can’t check, but did you try to use the property smiles in a callback?

@callback(
    Output("your-output-container", "children"),
    Input("your-component", "smiles")
)
def do(smiles):
    ...
    ...

Maybe you might want to add a button for triggering the callback and use State() for the smile prop.

3

Thank you for your suggstion @AIMPED . I tried it out, however the ‘smiles’ property only displays the static ‘smiles’ string which is hard-coded or passed as a parameter to the jsme object. I do not know how to get the real-time ‘smiles’ string. Is there an event that I can use to collect the real-time ‘smiles’ string?

@adamschroeder do you know where I can get more infromation on the JSME object’s callbacks?

4

How do you use these components @deepa-shalini ?

Could you provide a MRE?

5

hi @deepa-shalini
my colleague had a chance to look at the component and it looks like you can do what you’re asking for by using the eventSmiles prop. That will give you the smile string for the molecule actively displayed on the component. Here’s an example:

from dash import Dash, html, Input, Output, callback
import dash_bio as dashbio

app = Dash(__name__)

app.layout = html.Div([
    html.Div(id='smiles-event-output'),
    dashbio.Jsme(
        id='jsme',
        smiles='O=C(Nc1cccc(Cl)c1)c3cncc4nnc(c2ccc(OC(F)F)cc2)n34',
    ),
])


@callback(
    Output("smiles-event-output", "children"),
    Input("jsme", "eventSmiles")
)
def returnSmilesEvent(smiles):
    return(smiles)


if __name__ == '__main__':
    app.run(debug=True)
2 Likes
6

Many thanks, @adamschroeder . This is exactly what I was looking for.
Just want to point out that this information about callbacks is not present here.

2 Likes