I have app.py:
import dash
import dash_bootstrap_components as dbc
external_stylesheets = [dbc.themes.CERULEAN]
app=dash.Dash(__name__,external_stylesheets=external_stylesheets)
server=app.server
and index.py
from dash import dcc
from dash import html
from dash.dependencies import Input, Output
import dash_bootstrap_components as dbc
# Connect to main app.py file
from app import app
#from app import server
from apps import cyto_compound
app.layout = html.Div(
[
dbc.Row(
#for the moment, we put all in one column
#but maybe later put in separate columns
#just put one of each link into a different column
dbc.Col(
html.Div(
#id='link_list',
children=[
dcc.Location(id='url',pathname='',refresh=False),
dcc.Link('Compounds',href='/apps/cyto_compound'),
dcc.Link('Backend Dataset',href='/apps/backend_dataset')
]
),
)
),
dbc.Row(
dbc.Col(
html.Div(
id='page_content',
children=[]
)
)
)
]
)
@app.callback(
[Output(component_id='page_content',component_property='children')],
[Input(component_id='url',component_property='pathname')]
)
def display_page(temp_pathname):
if temp_pathname == '/apps/cyto_compound':
return [cyto_compound.layout]
else:
return 'under construction'
if __name__ == '__main__':
app.run_server(debug=True)
and one page of my app, cyto_compound.py
import dash_bootstrap_components as dbc
from dash import html
import dash_cytoscape as cyto
import pathlib
import json
from app import app
***cyto.load_extra_layouts()***
PATH = pathlib.Path(__file__).parent
DATA_PATH = PATH.joinpath("../datasets").resolve()
compound_json_address=DATA_PATH.joinpath('cyto_format_compound.json')
temp_json_file=open(compound_json_address,'r')
compound_network_dict=json.load(temp_json_file)
temp_json_file.close()
#the point of this is to add a property that we display.
##we could preprocess this once if we so desired
for temp_element in compound_network_dict['elements']['nodes']:
#id and label are special keys for cytoscape dicts
#they are always expected. our conversion script makes the id but does not make the name
#so we add it manually here
try:
temp_element['data']['label']='Bin: '+temp_element['data']['common_name']
except KeyError:
temp_element['data']['label']=temp_element['data']['name']
stylesheet=[
{
'selector':'node',
'style':{
'content':'data(label)',
'text-wrap':'wrap',
'text-max-width':100,
'font-size':13
}
},
]
layout=html.Div(
[
dbc.Row(
dbc.Col(
html.Div(
children=[
#a header
html.H1('Step 1: Choose Compounds')
]
),
width='auto',
)
),
#justify='center'
#),
#compounds
dbc.Row(
dbc.Col(
dbc.Card(
children=[
#compounds
cyto.Cytoscape(
id='cytoscape_compound',
layout={'name':'cola'},
elements=compound_network_dict['elements'],
stylesheet=stylesheet,
minZoom=0.3,
maxZoom=5
)
]
),
width='auto',
align='center'
)
#justify='center'
)
]
)
no matter where I put
import dash_cytoscape as cyto
cyto.load_extra_layouts()
I always get
No such layout dagre found. Did you forget to import it and cytoscape.use() it?
The code works when I do not specify a particular layout.
Any ideas?
