def test_dbm2003_select_atoms_via_callback(dash_duo):
app = dash.Dash(__name__)
app.layout = html.Div(
simple_app_layout(
dash_bio.Molecule2dViewer(id=_COMPONENT_ID, modelData=_data)))
simple_app_callback(
app,
dash_duo,
component_id=_COMPONENT_ID,
test_prop_name='selectedAtomIds',
test_prop_value=json.dumps([1, 4]),
prop_value_type='list',
validation_fn=lambda x: json.dumps(x) == json.dumps([1, 4]))
assert len(
dash_duo.find_elements(
'g.nodes-container > g.node.selected[index="1"]')) == 1
assert len(
dash_duo.find_elements(
'g.nodes-container > g.node.selected[index="2"]')) == 0
assert len(
dash_duo.find_elements(
'g.nodes-container > g.node.selected[index="3"]')) == 0
assert len(
dash_duo.find_elements(
'g.nodes-container > g.node.selected[index="4"]')) == 1
def test_dbm2004_select_deselect_atoms_via_click(dash_duo):
app = dash.Dash(__name__)
app.layout = html.Div([
dash_bio.Molecule2dViewer(id=_COMPONENT_ID, modelData=_data),
html.Div(id='clicked-atoms')
])
@app.callback(dash.dependencies.Output('clicked-atoms', 'children'),
[dash.dependencies.Input(_COMPONENT_ID, 'selectedAtomIds')])
def show_clicked_ids(ids):
return json.dumps(ids)
dash_duo.start_server(app)
atom_2 = dash_duo.find_element('g.nodes-container > g.node[index="2"]')
atom_2.click()
assert dash_duo.find_element('#clicked-atoms').text == json.dumps([2])
atom_3 = dash_duo.find_element('g.nodes-container > g.node[index="3"]')
atom_3.click()
assert dash_duo.find_element('#clicked-atoms').text == json.dumps([2, 3])
atom_2 = dash_duo.find_element(
'g.nodes-container > g.node.selected[index="2"]')
atom_2.click()
assert dash_duo.find_element('#clicked-atoms').text == json.dumps([3])
def test_dbm2002_preselected_atoms(dash_duo):
app = dash.Dash(__name__)
app.layout = html.Div(
simple_app_layout(
dash_bio.Molecule2dViewer(id=_COMPONENT_ID,
modelData=_data,
selectedAtomIds=[1, 3])))
dash_duo.start_server(app)
dash_duo.wait_for_element('#test-mol2d')
assert len(
dash_duo.find_elements(
'g.nodes-container > g.node.selected[index="1"]')) == 1
assert len(
dash_duo.find_elements(
'g.nodes-container > g.node.selected[index="3"]')) == 1
def tab_content(active_tab, memory):
if 'point' not in memory:
raise PreventUpdate
mol_name = DATA.iloc[memory['point']].xyz_file_name
path = structures_dir + '/' + mol_name
if active_tab == 'tab-speck':
mol = xyz_reader.read_xyz(datapath_or_datastring=path,
is_datafile=True)
mol_plot = dashbio.Speck(
id='my-speck',
data=mol,
view={
'zoom': 0.06,
'resolution': 450,
# 'ao': 0.1,
'outline': 0.001,
'atomScale': 0.15,
'relativeAtomScale': 0.33,
'bonds': True
},
presetView='stickball',
)
else:
mol = aio.read(path)
model_data = xyz_to_json(mol)
mol = xyz_reader.read_xyz(datapath_or_datastring=path,
is_datafile=True)
mol_plot = html.Div([
dashbio.Molecule2dViewer(
id='my-dashbio-molecule2d',
modelData=model_data,
width=450,
height=400,
),
# html.Hr(style={'padding-top': '0pt'}),
html.Div(id='molecule2d-output')
])
return mol_plot
def test_dbm2001_load_mol_data(dash_duo):
app = dash.Dash(__name__)
app.layout = html.Div(
simple_app_layout(dash_bio.Molecule2dViewer(id=_COMPONENT_ID)))
def compare_nodes_links(computed_props):
given_nodes = _data['nodes']
given_links = _data['links']
computed_nodes = computed_props['nodes']
computed_links = computed_props['links']
defined_node_props = ['id', 'atom']
for i in range(len(given_nodes)):
for key in defined_node_props:
if given_nodes[i][key] != computed_nodes[i][key]:
return False
defined_link_props = ['bond', 'strength', 'distance']
for i in range(len(given_links)):
for key in defined_link_props:
if given_links[i][key] != computed_links[i][key]:
return False
if given_links[i]['source'] != \
computed_links[i]['source']['id']:
return False
if given_links[i]['target'] != \
computed_links[i]['target']['id']:
return False
return True
simple_app_callback(app,
dash_duo,
component_id=_COMPONENT_ID,
test_prop_name='modelData',
test_prop_value=json.dumps(_data),
prop_value_type='dict',
validation_fn=lambda x: compare_nodes_links(x))
temp["target"] = count_map[temp_bond[1] - 1] + 1
temp["id"] = count
count = count + 1
Bonds.append(temp)
data["nodes"] = Atoms
data["links"] = Bonds
external_stylesheets = ['https://codepen.io/chriddyp/pen/bWLwgP.css']
app = dash.Dash(__name__, external_stylesheets=external_stylesheets)
app.layout = html.Div([
dashbio.Molecule2dViewer(
id='my-dashbio-molecule2d',
modelData=data,
#selectedAtomIds=list(range(1, 18))
),
html.Hr(),
html.Div(id='molecule2d-output')
])
@app.callback(
dash.dependencies.Output('molecule2d-output', 'children'),
[dash.dependencies.Input('my-dashbio-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]))
def layout():
return html.Div(
id='mol2d-body',
className='app-body',
children=[
html.Div(
id='mol2d-control-tabs',
className='control-tabs',
children=[
dcc.Tabs(
id='mol2d-tabs',
value='what-is',
children=[
dcc.Tab(
label='About',
value='what-is',
children=html.Div(
className='control-tab',
children=[
html.H4(
className='what-is',
children='What is Molecule2D?'),
html.
P('Molecule2D is a visualizer for molecular structures.'
),
html.
P('In the "View" tab, you can use the text input to '
'search the PubChem database by molecule name for '
'structural information.'),
html.
P('You can also change the bond lengths with the '
'slider provided.')
])),
dcc.Tab(
label='View',
children=html.Div(
className='control-tab',
children=[
html.Div(
title=
'Search for a molecule to view',
className='app-controls-block',
children=[
html.Div(
className=
'fullwidth-app-controls-name',
children=
'Search for molecule by name'
),
html.Div(
className=
'app-controls-desc',
children=
'Search the PubChem database for a molecule '
+
'by typing in its common name or its IUPAC name, '
+
'then pressing the return key. (e.g., '
+
'"penta-2,3-diene", "tylenol", "norepinephrine")'
),
dcc.Input(
id='mol2d-search',
placeholder='molecule name',
type='text',
value=
'buckminsterfullerene',
n_submit=1)
]),
html.Div(
title=
'Change the bond length multiplier',
className='app-controls-block',
children=[
html.Div(
className=
'app-controls-name',
children=
'Bond length multiplier'),
dcc.Slider(
id='mol2d-bond-length',
min=1,
max=100,
value=1),
html.Div(
className=
'app-controls-desc',
children=
'Increase bond lengths linearly from their '
+
'values at equilibrium. This visualization will be '
+
'reminiscent of chemical bond stretching.'
)
]),
html.Div(
id='mol2d-search-results-wrapper',
children=[
dcc.Dropdown(
id='mol2d-search-results')
]),
html.Hr(),
html.Div(id='error-wrapper'),
html.Div(id='mol2d-sel-atoms-output'),
]))
])
]),
html.Div(id='mol2d-container',
children=[
dash_bio.Molecule2dViewer(id='mol2d',
height=700,
width=700)
]),
dcc.Store(id='mol2d-search-results-store'),
dcc.Store(id='mol2d-compound-options-store')
])
external_stylesheets = ['https://codepen.io/chriddyp/pen/bWLwgP.css']
app = dash.Dash(__name__, external_stylesheets=external_stylesheets)
model_data = urlreq.urlopen(
'https://raw.githubusercontent.com/plotly/dash-bio-docs-files/master/' +
'mol2d_buckminsterfullerene.json').read()
if PY3:
model_data = model_data.decode('utf-8')
model_data = json.loads(model_data)
app.layout = html.Div([
dashbio.Molecule2dViewer(id='my-dashbio-molecule2d', modelData=model_data),
html.Hr(),
html.Div(id='molecule2d-output')
])
@app.callback(
dash.dependencies.Output('molecule2d-output', 'children'),
[dash.dependencies.Input('my-dashbio-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__':
external_stylesheets = ['https://codepen.io/chriddyp/pen/bWLwgP.css']
app = dash.Dash(__name__, external_stylesheets=external_stylesheets)
div_list=[html.P(children='''3D Structures of a Specific Molecular Graph''', style={'font-size':'15pt','font-family':'Helvetica','margin-left':'30px'})]
div_list.append(html.Div(children=['Graph ID: ',dcc.Input(id='g-id',value=1,type='number',style={'border-radius':'5px','width':'40px'}), '----- Graph Label: ', html.Div(id='label1',children='Molecule Label: 1')],style={'margin-left':'60px','textAlign':'center','display':'flex'}));
div_list.append(html.Hr());
div_list1=[html.P(children='''2D Structures of a Specific Molecular Graph''', style={'font-size':'15pt','font-family':'Helvetica','margin-left':'30px'})]
div_list1.append(html.Div(children=['Graph ID: ',dcc.Input(id='g-id1',value=1,type='number',style={'border-radius':'5px','width':'40px'}), '----- Graph Label: ', html.Div(id='label2',children='Molecule Label: 1')],style={'margin-left':'60px','textAlign':'center','display':'flex'}));
div_list1.append(html.Hr());
data_2d=Get_2Ddata(1);
div_list1.append(html.Div([
dashbio.Molecule2dViewer(
id='my-dashbio-molecule2d',
modelData=data_2d,
),
],style={'margin-left':'150px'}))
for i in range(1,16):
temp_data=Get_data(i);
div_list.append(html.Div(id='view'+str(i),children=[dashbio.Molecule3dViewer(styles=data,modelData=temp_data)]));
app.layout = html.Div([html.Div([
html.H1(children='''Data Visualization for Deep Learning Project''',
style={'textAlign':'center','color':'#7FDBFF'},id='testt'),
html.Div(children=div_list,style={'border':'thin lightgrey solid','margin':'0 auto','width':'800px','border-radius':'5px','background':'#FCFCFC','box-shadow':'rgb(240, 240, 240) 5px 5px 5px 0px'}),
html.Div(children=div_list1,style={'border':'thin lightgrey solid','margin':'0 auto','width':'800px','border-radius':'5px','background':'#FCFCFC','box-shadow':'rgb(240, 240, 240) 5px 5px 5px 0px'})
])],
style={'background':'''linear-gradient(rgba(255, 255, 255, 0.6),rgba(255, 255, 255, 0.6)),url("https://raw.githubusercontent.com/plotly/dash-docs/master/images/dash-pattern.png")'''})
