def Homepage(): layout = html.Div(children=[ nav,html.H5(id='fedbk'),html.Canvas(id='yes',height=1080,width=1920,style={'background-image':'url("assets/2.jpg")', 'background-repeat': 'no-repeat', 'background-size': '85% 75%' }) ]) return layout
def setTopology(self, types, names, x, y, operatesFrom, operatesTo, style): divList = [html.Canvas(id="fabricjs-canvas", style=style)] tList = [] for i in range(len(names)): id = "fabricjs-" + types[i] + '-' + names[i] + '-' + str( x[i]) + '-' + str( y[i]) + '-' + operatesFrom[i] + '-' + operatesTo[i] tList.append(html.Div(id=id)) divList.append(html.Div(tList, id="fabricjs-objects-container")) self.setDashRendering( html.Div(divList, id="fabricjs-canvas-container", style=style))
className="sliderContainer"), html.Div([ html.A('Nightlife:', className='preferencesText'), dcc.RangeSlider(id='nightlifeSlider', min=0, max=10, value=[5], step=1, marks={ 0: '0', 5: '5', 10: '10' }, className='slider') ], className="sliderContainer"), ], id="preferences_div", className="paddings"), html.Div( [html.Canvas(id="map", width='900', height='400')], id='map-div', ) ], id='map-section', className='col-12') ], className='body', ) ])
'name': 'viewport', 'content': 'width=device-width, initial-scale=1.0' }]) app.title = 'Pose Estimation Demo' app.layout = html.Div([ html.Div(id='start-target'), html.Div(id='stop-target'), dbc.Button("Start Recording", id="demo-start-recording"), dbc.Button("Stop Recording", id="demo-stop-recording"), html.Video(id='demo-video', width=600, height=500, autoPlay=True, controls=False), html.Canvas(id='demo-output'), html.Div(id='poses', style={'display': 'block'}), dcc.Interval(id='interval', interval=2000) ]) app.clientside_callback( """ function () { return sessionStorage.getItem('cachePoses'); } """, Output('poses', 'children'), [Input('interval', 'n_intervals')]) app.clientside_callback( ClientsideFunction(namespace='posenet', function_name='start_estimating_poses'), Output('start-target', 'children'),
block=True), visdcc.Run_js(id='guiajs'), ]), ]), ]), ], style={"width": "100%"}, ) ], width=8), dbc.Col([ dbc.Card( [ dbc.CardHeader(html.H6("Mordida")), dbc.CardBody([ html.Canvas(id='canvasMordida'), ]), ], style={"width": "100%"}, ), dbc.Card( [ dbc.CardHeader( html.H6("Cuña de medición")), dbc.CardBody([ html.Canvas(id='canvasCuna'), ]), ], style={"width": "100%"}, ), dbc.Card(
import dash_bootstrap_components as dbc import dash_html_components as html from data.others.home_background_script import script import visdcc from building_blocks import * from callbacks import * prefix="home" print("Loading "+prefix.capitalize()+" ...") layout=dbc.Col([ dbc.Col([ html.Canvas(id="fancy-network-background",style={"position":"absolute", "width":"100%", "height":"66vh", "padding":"0px", "z-index":"0"}),# "background": "linear-gradient(to top, rgba(230,245,249,0), rgba(230,245,249,0.5))" visdcc.Run_js(id="fancy_network_background_script", run=script), # html.Center(html.H1(html.Strong("COVIDrugNet"))), dbc.Row([ dbc.Col([ html.Img(src=app.get_asset_url("imgs/logo_wide.svg"), alt="COVID-19 Drugs Networker", style={"width":"100%"}), ], xs=10, lg=6, align="center", style={"position":"relative","z-index":"1"}), dbc.Col([ html.P("Visualize and Analyze Networks about Drugs and Targets Related to COVID-19", style={"text-align":"center","font-size":"x-large","font-weight":"bold","background":"white","box-shadow":"0rem 0rem 0.25rem white", "border-radius": "5rem"}), html.P("COVIDrugNet is a free and open web tool", style={"text-align":"center","font-size":"large","background":"white","box-shadow":"0rem 0rem 0.25rem white", "border-radius": "5rem", "margin-bottom":0}), html.P("based on networks and designed to support the exploration and investigation of the landscape of medicines currently in clinical trial for the treatment of COVID-19", style={"text-align":"center","font-size":"large","background":"white","box-shadow":"0rem 0rem 0.25rem white", "border-radius": "5rem", "margin-bottom":0}), html.P(["(according to ",html.A("DrugBank Dashboard dedicated to COVID-19", href="https://go.drugbank.com/covid-19", target="_blank", style={"color":"black"}),")"], style={"text-align":"center","font-size":"medium","background":"white","box-shadow":"0rem 0rem 0.25rem white", "border-radius": "5rem"}) ], xs=10, lg=3, align="center", style={"position":"relative","z-index":"1"}) ], justify="center", align="center", style={"padding-top":"7.5vh", "padding-bottom":"7.5vh"}), # html.Center(html.H4("Visualize and Analyze Networks about Drugs and Targets Related to COVID-19")), dbc.Row([
def setTopologyRedactor(self, types, names, x, y, operatesFrom, operatesTo, style): divList = [html.Canvas(id="fabricjs-canvas", style=style)] tList = [] for i in range(len(names)): id = "fabricjs-" + types[i] + '-' + names[i] + '-' + str( x[i]) + '-' + str( y[i]) + '-' + operatesFrom[i] + '-' + operatesTo[i] tList.append(html.Div(id=id)) divList.append(html.Div(tList, id="fabricjs-objects-container")) self.setDashRendering( html.Div([ html.Div(divList, id="fabricjs-canvas-container", style=style), html.Div([ 'Add Component:', html.Button( 'Reservoir', id="fabricjs-add-reservoir", name="fabricjs-add-reservoir", style={ 'backgroundColor': 'white', 'boxShadow': '0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)', 'fontSize': '0.7vmax', 'marginTop': '1vh', 'width': '15vw' }), html.Button( 'Turbine', id="fabricjs-add-turbine", name="fabricjs-add-turbine", style={ 'backgroundColor': 'white', 'boxShadow': '0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)', 'fontSize': '0.7vmax', 'marginTop': '1vh', 'width': '15vw' }), html.Button( 'Pump', id="fabricjs-add-pump", name="fabricjs-add-pump", style={ 'backgroundColor': 'white', 'boxShadow': '0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)', 'fontSize': '0.7vmax', 'marginTop': '1vh', 'width': '15vw' }), html.Button( 'Flow', id="fabricjs-add-flow", name="fabricjs-add-flow", style={ 'backgroundColor': 'white', 'boxShadow': '0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)', 'fontSize': '0.7vmax', 'marginTop': '1vh', 'width': '15vw' }), ], style={ 'display': 'flex', 'flexDirection': 'row' }), html.Button( 'Save', id="fabricjs-redactor-save", name="fabricjs-redactor-save", style={ 'backgroundColor': 'white', 'boxShadow': '0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)', 'fontSize': '0.7vmax', 'marginTop': '1vh', 'width': '15vw' }), ], id="fabricjs-redactor"))