Skip to content

Commit

Permalink
update dash
Browse files Browse the repository at this point in the history
  • Loading branch information
@xianhu
xianhu committed Jan 10, 2019
1 parent 40ae3ed commit 21afd1c
Show file tree
Hide file tree
Showing 6 changed files with 138 additions and 121 deletions.
12 changes: 8 additions & 4 deletions Dash/advcom/navbar.py
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,10 @@

# 通用组件
nav_item1 = dbc.NavItem(children=dbc.NavLink("首页", href="/"))
nav_item2 = dbc.NavItem(children=dbc.NavLink("Link2", href="#"))
nav_item2 = dbc.NavItem(children=dbc.NavLink("app1", href="/app1"))
nav_item3 = dbc.NavItem(children=dbc.NavLink("app2", href="/app2"))
nav_item4 = dbc.NavItem(children=dbc.NavLink("app3", href="/app3"))
nav_item5 = dbc.NavItem(children=dbc.NavLink("app4", href="/app4"))
drop_down = dbc.DropdownMenu(children=[
dbc.DropdownMenuItem("More", header=True),
dbc.DropdownMenuItem("Entry app1", href="/app1"),
Expand All @@ -19,14 +22,15 @@
dbc.DropdownMenuItem("Entry app3", href="/app3"),
dbc.DropdownMenuItem("Entry app4", href="/app4"),
], nav=True, in_navbar=True, label="Menu")
nav_item_list = [nav_item1, nav_item2, nav_item3, nav_item4, nav_item5, drop_down]

# 定义不同的导航栏
navbar_default = dbc.NavbarSimple(children=[nav_item1, nav_item2, drop_down], brand="Dash", brand_href="#", sticky="top")
navbar_default = dbc.NavbarSimple(children=nav_item_list, brand="Dash", brand_href="#", sticky="top")

navbar_custom = dbc.Navbar(children=dbc.Container(children=[
dbc.NavbarBrand("Dash", href="#"),
# dbc.NavbarToggler(id="navbar-toggler1"),
dbc.Collapse(children=dbc.Nav([nav_item1, nav_item2, drop_down], className="ml-auto", navbar=True), navbar=True),
dbc.Collapse(children=dbc.Nav(nav_item_list, className="ml-auto", navbar=True), navbar=True),
]))

navbar_logo = dbc.Navbar(children=dbc.Container(children=[
Expand All @@ -35,7 +39,7 @@
dbc.Col(dbc.NavbarBrand("Dash", className="ml-2")),
], align="center", no_gutters=True), href="https://plot.ly"),
# dbc.NavbarToggler(id="navbar-toggler2"),
dbc.Collapse(children=dbc.Nav([nav_item1, nav_item2, drop_down], className="ml-auto", navbar=True), navbar=True),
dbc.Collapse(children=dbc.Nav(nav_item_list, className="ml-auto", navbar=True), navbar=True),
]), color="dark", dark=True)

navbar_search = dbc.Navbar(children=dbc.Container(children=[
Expand Down
16 changes: 6 additions & 10 deletions Dash/apps/app1.py
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,9 +11,6 @@
from dash.dependencies import Output, Input
from Dash.app import app

# 全局变量
df = pd.read_csv("apps/data.csv")

# 构造components
tab1_content = dbc.Card(children=dbc.CardBody([
dbc.CardText("This is tab 1!"),
Expand All @@ -30,10 +27,6 @@ def generate_table(dataframe, max_rows=10, size="md"):
"""
创建表
"""
# Headers
headers = [html.Th(col, className="text-center") if index != 1 else html.Th(col) for index, col in enumerate(dataframe.columns[:10])]

# Rows
rows = []
for i_row in range(max_rows):
td_list = []
Expand All @@ -43,6 +36,7 @@ def generate_table(dataframe, max_rows=10, size="md"):
else:
td_list.append(html.Td(dataframe.iloc[i_row][col], className="text-center"))
rows.append(html.Tr(td_list))
headers = [html.Th(col, className="text-center") if index != 1 else html.Th(col) for index, col in enumerate(dataframe.columns[:10])]
return dbc.Table([html.Thead(html.Tr(headers)), html.Tbody(rows)], striped=True, bordered=True, hover=True, size=size)


Expand Down Expand Up @@ -120,13 +114,15 @@ def generate_table(dataframe, max_rows=10, size="md"):
{"x": [1, 2, 3], "y": [2, 4, 5], "type": "bar", "name": u"Montréal"},
],
"layout": {
"title": "Dash Data Visualization"
"title": "Dash Data Visualization",
"xaxis": {"title": "类别", },
"yaxis": {"title": "数量", },
}
}, className="mt-2"),

# 表格Table ========================================================================================
html.Div(children=generate_table(df, size="sm"), className="mt-2"),
html.Div(children=generate_table(df, size="md"), className="mt-2"),
html.Div(children=generate_table(pd.read_csv("apps/data.csv"), size="sm"), className="mt-2"),
html.Div(children=generate_table(pd.read_csv("apps/data.csv"), size="md"), className="mt-2"),
])


Expand Down
66 changes: 34 additions & 32 deletions Dash/apps/app2.py
View file
Original file line number Diff line number Diff line change
Expand Up @@ -39,25 +39,25 @@
# ---------------------------------------------------------------------------------------
email_input = dbc.FormGroup(children=[
dbc.Label("Email", html_for="example-email"),
dbc.Input(type="email", placeholder="Enter email"),
dbc.Input(placeholder="Enter email", type="email"),
dbc.FormText("Are you on email? You simply have to be these days", color="secondary"),
])

password_input = dbc.FormGroup(children=[
dbc.Label("Password", html_for="example-password"),
dbc.Input(type="password", placeholder="Enter password"),
dbc.Input(placeholder="Enter password", type="password"),
dbc.FormText("A password stops mean people taking your stuff", color="secondary"),
])

# ---------------------------------------------------------------------------------------
email_input_row = dbc.FormGroup(children=[
dbc.Label("Email", html_for="example-email-row", width=2),
dbc.Col(dbc.Input(type="email", placeholder="Enter email"), width=10)
dbc.Col(dbc.Input(placeholder="Enter email", type="email"), width=10)
], row=True)

password_input_row = dbc.FormGroup(children=[
dbc.Label("Password", html_for="example-password-row", width=2),
dbc.Col(dbc.Input(type="password", placeholder="Enter password"), width=10)
dbc.Col(dbc.Input(placeholder="Enter password", type="password"), width=10)
], row=True)

# ---------------------------------------------------------------------------------------
Expand Down Expand Up @@ -123,20 +123,20 @@

# 按钮类 ========================================================================================
html.Div(children=[
dbc.Button("Primary", color="primary", className="mr-2", id="button_memory"),
dbc.Button("Secondary", color="secondary", className="mr-2", id="button_local"),
dbc.Button("Success", color="success", className="mr-2", id="button_session"),
dbc.Button("Info", color="info", className="mr-2"),
dbc.Button("Warning", color="warning", className="mr-2"),
dbc.Button("Danger", color="danger", className="mr-2"),
dbc.Button("outline", color="primary", className="mr-2", size="sm", outline=True),
dbc.Button("outline", color="secondary", className="mr-2", size="md", outline=True),
dbc.Button("outline", color="success", className="mr-2", size="lg", outline=True),
dbc.Button("outline", color="info", className="mr-2", size="md", outline=True),
dbc.Button("outline", color="warning", className="mr-2", size="sm", outline=True),
dbc.Button("primary", color="primary", className="mr-2", id="button_memory"),
dbc.Button("secondary", color="secondary", className="mr-2", id="button_local"),
dbc.Button("success", color="success", className="mr-2", id="button_session"),
dbc.Button("info", color="info", className="mr-2"),
dbc.Button("warning", color="warning", className="mr-2"),
dbc.Button("danger", color="danger", className="mr-2"),
dbc.Button("primary", color="primary", className="mr-2", size="sm", outline=True),
dbc.Button("secondary", color="secondary", className="mr-2", size="md", outline=True),
dbc.Button("success", color="success", className="mr-2", size="lg", outline=True),
dbc.Button("info", color="info", className="mr-2", size="md", outline=True),
dbc.Button("warning", color="warning", className="mr-2", size="sm", outline=True),
], className="mt-2"),

html.Div(children=dbc.ButtonGroup([
html.Div(children=dbc.ButtonGroup(children=[
dbc.Button("Primary", color="primary"),
dbc.Button("Secondary", color="secondary"),
dbc.Button("Success", color="success"),
Expand Down Expand Up @@ -201,25 +201,25 @@
dbc.Input(value=10, type="number", className="mb-2"),
dbc.Input(value=10, type="range", className="mb-2"),
dbc.Textarea(placeholder="Enter a value...", className="mb-2"),
dbc.Textarea(placeholder="Enter a value...", className="mb-2", valid=True, bs_size="sm"),
dbc.Textarea(placeholder="Enter a value(sm)...", className="mb-2", valid=True, bs_size="sm"),
], className="mt-2"),

html.Div(children=[
dbc.InputGroup([
dbc.InputGroupAddon("@", addon_type="prepend"),
dbc.Input(placeholder="username, size=lg"),
], size="lg", className="mb-2"),
dbc.Input(placeholder="username"),
], size="md", className="mb-2"),
dbc.InputGroup([
dbc.Input(placeholder="username, size=md"),
dbc.Input(placeholder="username"),
dbc.InputGroupAddon("@example.com", addon_type="append"),
], className="mb-2"),
dbc.InputGroup([
dbc.InputGroupAddon("$", addon_type="prepend"),
dbc.Input(placeholder="Amount, size=sm", type="number"),
dbc.Input(placeholder="Amount", type="number"),
dbc.InputGroupAddon(".00", addon_type="append"),
], size="sm", className="mb-2"),
], size="md", className="mb-2"),
dbc.InputGroup([
dbc.InputGroupAddon(dbc.Button("Random name"), addon_type="prepend"),
dbc.InputGroupAddon(dbc.Button("Random"), addon_type="prepend"),
dbc.Input(placeholder="name"),
], className="mb-2"),
dbc.InputGroup([
Expand All @@ -234,11 +234,11 @@
dbc.Form(children=[
dbc.FormGroup([
dbc.Label("Email", className="mr-2"),
dbc.Input(type="email", placeholder="Enter email")
dbc.Input(placeholder="Enter email", type="email")
], className="mr-3"),
dbc.FormGroup([
dbc.Label("Password", className="mr-2"),
dbc.Input(type="password", placeholder="Enter password")
dbc.Input(placeholder="Enter password", type="password")
], className="mr-3"),
dbc.FormGroup([
dbc.Label("Date", className="mr-2"),
Expand All @@ -253,7 +253,7 @@
# 表单类 ========================================================================================
html.Div(children=[
dbc.Label("Slider", html_for="slider"),
dcc.Slider(min=0, max=9, marks={i: "Label {}".format(i) if i == 1 else str(i) for i in range(1, 6)}, value=5),
dcc.Slider(min=0, max=9, marks={i: "Label {}".format(i) for i in range(1, 10)}, value=5),
html.Br(),
dbc.Label("RangeSlider", html_for="range-slider"),
dcc.RangeSlider(count=1, min=-5, max=10, step=0.5, value=[-3, 7])
Expand Down Expand Up @@ -321,13 +321,15 @@
@app.callback(Output(store, "data"), [
Input("button_%s" % store, "n_clicks")
], [
State(store, "data")
State(store, "data"),
State(store, "modified_timestamp"),
])
def toggle_store_button(n_clicks, data):
def toggle_store_button(n_clicks, data, ts):
if n_clicks is None:
raise dash.exceptions.PreventUpdate
data = data or {"clicks": 0}
data = data or {"clicks": 0, "ts": -1}
data["clicks"] = data["clicks"] + 1
data["ts"] = ts
return data

@app.callback(Output("alert_%s" % store, "children"), [
Expand All @@ -336,11 +338,11 @@ def toggle_store_button(n_clicks, data):
State(store, "data"),
State(store, "id")
])
def toggle_store_change(ts, data, _id):
def toggle_store_change(ts, data, name):
if ts is None:
raise dash.exceptions.PreventUpdate
data = data or {}
return "%s: %s" % (_id, data.get("clicks", 0))
data = data or {"clicks": 0, "ts": -1}
return "%s: %s, ts=%s" % (name, data["clicks"], data["ts"])


@app.callback(Output("collapse", "is_open"), [
Expand Down
16 changes: 4 additions & 12 deletions Dash/apps/app3.py
View file
Original file line number Diff line number Diff line change
Expand Up @@ -43,27 +43,19 @@
html.Div(children=dbc.Row(children=[
dbc.Col(children=dbc.Card([
dbc.CardHeader("Hover Data"),
dbc.CardBody([
dbc.CardText(html.Pre(id="hover-data")),
]),
dbc.CardBody(dbc.CardText(html.Pre(id="hover-data"))),
])),
dbc.Col(children=dbc.Card([
dbc.CardHeader("Click Data"),
dbc.CardBody([
dbc.CardText(html.Pre(id="click-data")),
]),
dbc.CardBody(dbc.CardText(html.Pre(id="click-data"))),
])),
dbc.Col(children=dbc.Card([
dbc.CardHeader("Selected Data"),
dbc.CardBody([
dbc.CardText(html.Pre(id="selected-data")),
]),
dbc.CardBody(dbc.CardText(html.Pre(id="selected-data"))),
])),
dbc.Col(children=dbc.Card([
dbc.CardHeader("Zoom and Relayout Data"),
dbc.CardBody([
dbc.CardText(html.Pre(id="relayout-data")),
]),
dbc.CardBody(dbc.CardText(html.Pre(id="relayout-data"))),
])),
]), className="mt-2"),
])
Expand Down
Loading

0 comments on commit 21afd1c

Please sign in to comment.