-
Notifications
You must be signed in to change notification settings - Fork 2
/
component.py
127 lines (105 loc) · 3.36 KB
/
component.py
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
import dash
import dash_bootstrap_components as dbc
import dash_alternative_viz as dav
from dash import html
from dash import dcc
# styling the sidebar
SIDEBAR_STYLE = {
"position": "fixed",
"top": 0,
"left": 0,
"bottom": 0,
"width": "16rem",
"padding": "2rem 1rem",
"background-color": "#f8f9fa",
}
# padding for the page content
CONTENT_STYLE = {
"margin-left": "18rem",
"margin-right": "2rem",
"padding": "2rem 1rem",
}
sidebar = html.Div(
[
html.Img(src="./assets/mds-hex-sticker-small.png", height="15%", style={"display":"block", "margin":"0 auto"}),
# html.H1("UBC-MDS", className="display-1", style={'font-size':'25px', 'textAlign':'center'}),
html.H1("Tratadores", className="display-1", style={'font-size':'25px', 'textAlign':'center'}),
html.Hr(),
html.P(
"In Data Science We Trust", className="lead"
),
dbc.Nav(
[
dbc.NavLink("Page1", href="/", active="exact"), ##exact mean when url is equal to href, then it is active
],
vertical=True,
pills=True,
)
],
style=SIDEBAR_STYLE,
)
def gen_basic_unit(_id, _type, style={'height':'30vh', 'overflow-x': 'scroll'}, width=5):
if _type == "altair":
return dbc.Col([
dbc.Card(
[
dbc.CardHeader(id="h"+_id, style={'font-size':'15px', 'textAlign':'left'}),
dbc.CardBody(dav.VegaLite(id="f"+_id)),
], style=style)
], width=width)
elif _type == "plotly":
return dbc.Col([
dbc.Card(
[
dbc.CardHeader(id="h"+_id, style={'font-size':'15px', 'textAlign':'left'}),
dbc.CardBody(dcc.Graph(id="f"+_id)),
], style=style)
], width=width)
elif _type == "cytospace":
return dbc.Col([
dbc.Card(
[
dbc.CardHeader(id="h"+_id, style={'font-size':'15px', 'textAlign':'left'}),
dbc.CardBody(html.Div(id="f"+_id)),
], style=style)
], width=width)
# content_unit_altair = html.Div(
# [
# dbc.Row(
# [
# dbc.Col([
# dbc.Card([
# dbc.CardBody(id='alt11', children=[]),
# ]),
# ], width=5),
# dbc.Col([
# dbc.Card([
# dbc.CardBody(id='alt12', children=[]),
# ]),
# ], width=5),
# ],
# className='mb-2'
# )
# ],
# style=CONTENT_STYLE,
# )
# content = html.Div(
# [dbc.Row(
# [
# dbc.Col([
# dbc.Card([
# dbc.CardBody(id=f'alt{i}1', children=[]),
# ]),
# ], width=5),
# dbc.Col([
# dbc.Card([
# dbc.CardBody(id=f'alt{i}2', children=[]),
# ]),
# ], width=5),
# ],
# className='mb-2'
# ) \
# for i in range(4)
# ],
# style=CONTENT_STYLE,
# )