dash_bio.Molecule2dViewer Examples and Reference

import json
import urllib.request as urlreq
from dash import Dash, html, Input, Output, callback
import dash_bio as dashbio

app = Dash(__name__)


model_data = urlreq.urlopen(
    'https://git.io/mol2d_buckminsterfullerene.json'
).read().decode('utf-8')

model_data = json.loads(model_data)

app.layout = html.Div([
    dashbio.Molecule2dViewer(
        id='dashbio-default-molecule2d',
        modelData=model_data
    ),
    html.Hr(),
    html.Div(id='default-molecule2d-output')
])

@callback(
    Output('default-molecule2d-output', 'children'),
    Input('dashbio-default-molecule2d', 'selectedAtomIds')
)
def update_selected_atoms(ids):
    if ids is None or len(ids) == 0:
        return "No atom has been selected. Select atoms by clicking on them."
    return "Selected atom IDs: {}.".format(', '.join([str(i) for i in ids]))

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

import json
import urllib.request as urlreq
import dash_bio as dashbio



model_data = urlreq.urlopen(
    'https://git.io/mol2d_buckminsterfullerene.json'
).read().decode('utf-8')


dashbio.Molecule2dViewer(
    id='molecule2d-selectedatomids',
    modelData=json.loads(model_data),
    selectedAtomIds=list(range(10))
)

import json
import urllib.request as urlreq
import dash_bio as dashbio



model_data = urlreq.urlopen(
    'https://git.io/mol2d_buckminsterfullerene.json'
).read().decode('utf-8')

model_data = json.loads(model_data)
for atom in model_data['nodes']:
    atom.update(atom='N')
for bond in model_data['links']:
    bond.update(distance=50.0, strength=0.5)

dashbio.Molecule2dViewer(
    id='molecule2d-modeldata',
    modelData=model_data
)

Molecule2dViewer Properties