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")'''})