className="salinityGraph",
figure={
'data': trace,
'layout': layout
})
time_slider = dcc.Slider(
id="energyTimeSlider",
min=0,
max=len(get_time_data()) - 1,
value=0,
# a condition to show every third label:
marks={(num): ({
'label': str(i.strftime('%Y-%m-%d %H:%M')),
'style': {
'color': 'black',
"transform": "rotate(45deg)",
'margin-top': '5vh'
}
} if num % 3 == 0 else {
'label': ''
})
for num, i in enumerate(get_time_data())},
included=False,
className="timeSlider")
depth_slider = dcc.Slider(
id="energyDepthSlider",
min=0,
max=len(get_depth_data()) - 1,
value=len(get_depth_data()) - 1,
],
style={
'width': '48%',
'float': 'right',
'display': 'inline-block'
})
]),
# The first visualization view to show the Los Angeles International Airport - Passenger Traffic By Terminal
dcc.Graph(id='first-view'),
# A visual interface widget of Slider for users to choose the report month
dcc.Slider(
id='month--slider',
min=df['ReportMonth'].min(),
max=df['ReportMonth'].max(),
value=df['ReportMonth'].min(),
marks={str(month): str(month)
for month in df['ReportMonth'].unique()},
step=None),
html.Div(
[
# A visual interface widget of DropDown for users to choose the report date
dcc.Dropdown(id='ReportDate',
options=[{
'label': i,
'value': i
} for i in report_dates],
value=report_dates[0])
],
style={
external_stylesheets = ["https://codepen.io/chriddyp/pen/bWLwgP.css"]
app = dash.Dash(__name__, external_stylesheets=external_stylesheets)
colors = {"background": "#AAAAAA", "text": "#000000"}
app.layout = html.Div([
html.H1(
id="heading",
children="Interactive Sine wave",
style={"textAlign": "center"},
),
dcc.Graph(id="graph-sine"),
html.H3(id="label-amp", children="Amplitude"),
dcc.Slider(
id="amp-slider", min=0, max=10, value=5, step=0.5, updatemode="drag"),
html.H3(id="label-freq", children="Frequency"),
dcc.Slider(
id="freq-slider", min=1, max=10, value=5, step=0.5, updatemode="drag"),
html.H3(id="label-phase", children="Phase"),
dcc.Slider(
id="phase-slider",
min=0,
max=2 * np.pi,
value=0,
step=0.5,
updatemode="drag",
),
html.H3(id="label-offset", children="Offset"),
dcc.Slider(id="offset-slider",
min=-5,
def body():
return html.Div(children=[
html.Div(id='left-column', children=[
dcc.Tabs(
id='tabs', value='About this App',
children=[
dcc.Tab(
label='About this App',
value='About this App',
children=html.Div(children=[
html.Br(),
html.H4('What is this app?', style={"text-align":"center"}),
html.P(
"""
This app computes the replication strategy of exchange options (also known as Margrabe options) on a set of given inputs, in the Black-Scholes-Merton (BSM) framework.
"""
),
html.P(
"""
The goal is to showcase that under the BSM model's assumptions (see "Model" tab), the price \(V_0\) given by the BSM formula is "arbitrage-free". Indeed, we show that in this case,
it is possible to build a strategy that
"""
),
html.Ul([html.Li("Can be initiated with \(V_0\) cash at time \(0\)."),
html.Li('Is self-financing (i.e., no need to "feed" the strategy with extra cash later'),
html.Li("Will deliver exactly the payoff of the option at maturity")
]),
html.Hr(),
html.H4("Type of options", style={"text-align":"center"}),
html.P([
"""
The considered options are exchange options, which give at maturity the right to exchange one risky asset for another. The option payoff is given by
$$\psi(T)=max(0,S_1(T)-S_2(T))$$
"""]),
html.Hr(),
html.P(
"""
Read more about options :
https://en.wikipedia.org/wiki/Option_(finance)
"""
),
])
),
dcc.Tab(
label="Model",
value="Model",
children=[html.Div(children=[
html.Br(),
html.H4("Model assumptions", style={"text-align":"center"}),
"The BSM main assumptions are:",
html.Ul([html.Li("It does not consider dividends and transaction costs"),
html.Li("The volatility and risk-free rate are assumed constant"),
html.Li("Fraction of shares can be traded")]),
html.P([
"""Under BSM, the two underlying asset's dynamics are modeled with a geometric Brownian motion:
$$dS_1(t) = \mu_1 S_1(t)dt+\sigma_1 S_1(t)dW_1(t)$$ $$dS_2(t) = \mu_2 S_2(t)dt+\sigma_2 S_2(t)dW_2(t) $$Where \(\mu_i\) is the drift, \(\sigma_i\) the volatility, \(dW_i(t)\) the increment of a Brownian motion and \(dW_1(t)dW_2(t)=\\rho dt\)"""]),
html.Hr(),
html.H4("Option price", style={"text-align":"center"}),
html.P([
"""
The exchange option BSM price was derived by Margrabe in his 1978 paper:
$$V_t = S_1(t)\Phi(d_1)-S_2(t)\Phi(d_2)$$ Where \(\Phi(.)\) is the standard normal cumulative distribution function,
\(d_1\) and \(d_2\) constants $$d_1=\\frac{1}{\hat{\sigma}\sqrt{T-t}}\left[ln(\\frac{S_1(t)}{S_2(t)})+\\frac{\hat{\sigma^2}}{2}(T-t)\\right]$$$$d_2=d_1-\hat{\sigma}\\sqrt{T-t}$$$$\hat{\sigma^2}=\sigma^2_1+\sigma_2^2-2\\rho\sigma_1\sigma_2$$
This pricing formula originate from the BSM partial differential equation, which is valid for any type of European option:
$$\\frac{\partial V_t}{\partial t}+\\frac{\sigma^{2}S^{2}_t}{2}\\frac{\partial^{2}V_t}{\partial S^{2}}+rS_t\\frac{\partial V_t}{\partial S} = rV_t$$
Where \(V_t=f(t,S_t)\) the price of the option at time t. To get the pricing formulas, solve the PDE with terminal condition the payoff \(\psi(X)\) of the desired European-type option.
"""]),
html.Hr(),
html.H4("Academic references", style={"text-align":"center"}),
"The main academic references used were:",
html.Ul([html.Li("Vrins, F. (2017-2018). Course notes for Derivatives Pricing. (Financial Engineering Program, Louvain School of Management, Université catholique de Louvain)"),
html.Li("Margrabe, W. (1978). The Value of an Option to Exchange One Asset for Another. Journal of Finance, 33, 177-186."),]),
])]),
#
dcc.Tab(
label="Appro-ach",
value="Appro-ach",
children=[html.Div(children=[
html.Br(),
html.H4("Methodology followed", style={"text-align":"center"}),
html.P([
"""
To prove that the BSM price is arbitrage-free, let us try to perfectly replicate it with a strategy. If the strategy is successful, then
the BSM price is unique and therefore arbitrage-free.
"""]),
html.Hr(),
html.H4("Stock simulation", style={"text-align":"center"}),
html.P([
"""
We use the analytical solution to the GBM SDE, using Îto: \(S_t=S_0exp((\mu-\\frac{\sigma^2}{2})t+\sigma W_t)\). Then, suppose that the stock price
observations are equally spaced: \(t_i=i\delta, i \in \{1,2,\dots,n\}, n=T/\delta\)\(,\\forall \delta>0\)
This corresponds to $$S_{t+\delta}=S_texp((\mu-\\frac{\sigma^2}{2})\delta+\sigma\sqrt{\delta}Z), Z\sim \mathcal{N}(0,1)$$
"""]),
html.Hr(),
html.H4("Replicating portfolio", style={"text-align":"center"}),
html.Label("Step 1", style={'font-weight': 'bold'}),
html.P([
"""
We infer the dynamics of the option price by applying 2D Ito's lemma to the BSM PDE. We simplify the notation, and complying with Ito \(V_t=f(t,S_1, S_2)\):
$$dV_t=[f_t+\\frac{1}{2}(f_{xx}\sigma_1^2S_1^2+2f_{xy}\sigma_1\sigma_2S_1S_2\\rho$$ $$+f_{yy}\sigma_2^2S_2^2)]dt+f_xdS_1+f_ydS_2$$ Where \(f_i\) are the partial derivatives relative to each stock.
"""]),
html.Label("Step 2", style={'font-weight': 'bold'}),
html.P([
"""
The randomness embedded in the stocks \(S_i(t)\) is taken care of by hedging away \(dS_i(t)\). Let us now
create a portfolio \(\Pi_t\) with starting cash the exchange option price. All the cash goes into the two stocks: at inception, we buy \(\Delta_1(t)\) and \(\Delta_2(t)\) shares at cost
\(\Delta_1(t)S_1(t)+\Delta_2(t)S_2(t)\). There is no cash remaining. If the strategy is financially self-sufficiant, then $$d\Pi_t=\Delta_1(t)dS_1(t)+\Delta_2(t)dS_2(t)$$
This means that the change in portfolio value results only from the gains/losses obtained by holding the stocks. When we rebalance the portfolio, we always sell some of one stock to buy some of the other.
The cash account is always at 0.
"""]),
html.Label("Step 3", style={'font-weight': 'bold'}),
html.P([
"""
Equating \(dV_t=d\Pi_t\), we observe that the portfolio will perfectly replicate the option price if $$\Delta_1(t)=f_x(t,S_1(t),S_2(t))$$ $$\Delta_2(t)=f_y(t,S_1(t),S_2(t))$$
"""]),
html.P([
"""
\(\Delta_i=f_i(t,S_1(t),S_2(t))\) indicates the number of shares to hold at any instant in order to replicate the BSM price.
Deriving the two, they are equal to \(\Delta_1(t) = \Phi(d_1)\) and \(\Delta_2(t)=-\Phi(d_2)\).
"""]),
html.P([
"""
Holding \(\Delta_1(t)\) and \(\Delta_2(t)\) at all times, we have found a strategy that perfectly replicates the BSM price, therefore proving it is the unique
price that prevents arbitrage opportunities.
"""]),
html.P([
"""
Indeed, because it is possible to generate the option’s payoff by being given exactly the cash amount \(V_0\) given by the BSM
formula, the option price must agree with \(V_0\). Otherwise, for \(k>0\), if the price of the option is \(V_0+k\), you can sell the option at \(V_0+k\), launch the strategy (which only requires \(V_0\)), and get a
profit of \(k\) today. At maturity, the strategy will deliver exactly the amount that you have to pay to the option’s buyer. If \(k<0\), do the opposite (buy the option, sell the strategy).
"""]),
])]),
#
#
dcc.Tab(
label='Inputs',
value='Inputs',
children=html.Div(children=[
html.Br(),
#
html.P(
"""
Place your mouse over any input to get its definition.
"""
),
#
html.Div(children=[html.Label('Spot price 1', title=list_input["Spot price"], style={'font-weight': 'bold', "text-align":"left", "width":"25%",'display': 'inline-block'} ),
dcc.Input(id="S1", value=100, debounce=True, type='number', style={"width":"16%", 'display': 'inline-block'}),
html.P("",id="message_S1", style={"font-size":12, "color":"red", "padding":5, 'width': '55%', "text-align":"left", 'display': 'inline-block'})
]
),
html.Div(children=[html.Label("Spot price 2", title=list_input["Spot price"], style={'font-weight': 'bold',"text-align":"left", "width":"25%",'display': 'inline-block'} ),
dcc.Input(id="S2", value=100, debounce=True, type='number', style={"width":"16%", 'display': 'inline-block'}),
html.P("",id="message_S2", style={"font-size":12, "color":"red", "padding":5, 'width': '55%', "text-align":"left", 'display': 'inline-block'})
],
),
#
html.Div([html.Label('Stocks correlation', title=list_input["Correlation"], style={'font-weight': 'bold', "display":"inline-block"}),
html.Label(id="correlation", style={"display":"inline-block"}),]),
#
dcc.Slider(id='corr', min=-1, max=1, step=0.01, value=0.30, marks={-1:"-1", 0:"0", 1:"1"}),
#
html.Div(children=[html.Label("Drift stock 1", title=list_input["Drift"], style={'font-weight': 'bold', 'display': 'inline-block'}),
html.Label(id="drift1", style={'display': 'inline-block'}),
]
),
#
dcc.Slider(id='mu1', min=-0.40, max=0.40, value=0.10, step=0.01, marks={-0.40: '-40%', 0:"0%", 0.40: '40%'}),
#
html.Div([html.Label('Volatility stock 1', title=list_input["Volatility"], style={'font-weight': 'bold', "display":"inline-block"}),
html.Label(id="sigma1", style={"display":"inline-block"}),]),
#
dcc.Slider(id='vol1', min=0, max=1, step=0.01, value=0.25, marks={0:"0%", 0.5:"50%", 1:"100%"}),
#
html.Div(children=[html.Label("Drift stock 2", title=list_input["Drift"], style={'font-weight': 'bold', 'display': 'inline-block'}),
html.Label(id="drift2", style={'display': 'inline-block'}),
]
),
#
dcc.Slider(id='mu2', min=-0.40, max=0.40, value=-0.10, step=0.01, marks={-0.40: '-40%', 0:"0%", 0.40: '40%'}),
#
html.Div([html.Label('Volatility stock 2', title=list_input["Volatility"], style={'font-weight': 'bold', "display":"inline-block"}),
html.Label(id="sigma2", style={"display":"inline-block"}),]),
#
dcc.Slider(id='vol2', min=0, max=1, step=0.01, value=0.10,marks={0:"0%", 0.5:"50%", 1:"100%"}),
#
html.Div([html.Label('Risk-free rate', title=list_input["Risk-free rate"], style={'font-weight': 'bold', "display":"inline-block"}),
html.Label(id="riskfree", style={"display":"inline-block"}),]),
dcc.Slider(id='Rf', min=0, max=0.1, step=0.01, value=0.03, marks={0:"0%", 0.05:"5%", 0.1:"10%"}),
#
html.Div([html.Label('Maturity', title=list_input["Maturity"], style={'font-weight':'bold', "display":"inline-block"}),
html.Label(id="matu", style={"display":"inline-block"}),]),
dcc.Slider(id='T', min=0.25, max=5, # marks={i: '{}'.format(i) for i in range(6)},
marks={0.25:"3 months", 2.5:"2.5 years", 5:"5 years"}, step=0.25, value=3.5),
#
html.Br(),
html.Div([
html.Label('Discretization step (dt)', title=list_input["Discretization step"], style={'font-weight': 'bold', "text-align":"left",'width': '50%', 'display': 'inline-block'}),
dcc.Input(id="dt", value=0.01, debounce=True, type='number', style={"width":"16%", 'display': 'inline-block'}),
html.P("",id="message_dt", style={"font-size":12, "color":"red", 'width': '34%', "text-align":"left", 'display': 'inline-block'})
]),
#
html.Div([
html.Label("Time between two rebalancing (in dt unit)", title=list_input["Rebalancing frequency"], style={'font-weight': 'bold', 'width': '50%', "text-align":"left", 'display': 'inline-block'}),
dcc.Input(id="dt_p", value=1,debounce=True, type='number', style={"width":"16%", 'display': 'inline-block'}),
html.P("",id="message_dt_p", style={"font-size":12, "color":"red", 'width': '34%', "text-align":"left", 'display': 'inline-block'})
]),
#
html.Div([html.Label('Transaction costs', title=list_input["Transaction costs"], style={'font-weight': 'bold', "text-align":"left",'width': '50%', 'display': 'inline-block'}),
dcc.Input(id="TransactionCosts", value=0, debounce=True, type='number', style={"width":"16%", 'display': 'inline-block'}),
html.Label(id="unit_TC", style={"padding":5, "display":"inline-block"})
]),
#
dcc.RadioItems(id="FixedOrPropor",
options=[{'label': 'No TC', 'value': 'NTC'},
{'label': 'Fixed TC', 'value': 'FTC'},
{'label': 'Proportional TC', 'value': 'PTC'}
],
value='NTC',
labelStyle={'padding':5, 'font-weight': 'bold', 'display': 'inline-block'}
),
#
html.Label(children=[dbc.Button("Change stock trajectory", id="ButtonChangeStockTrajectory", color="primary", className="mr-1",)],
title=list_input["Seed"]),
html.Div(children=[html.Label("The current stock trajectory scenario is: ", style={'display': 'inline-block', "padding":5}),
dcc.Input(id='seed', readOnly=False, debounce=True, value='1', min=1,max=500000, type='number', style={"width":"20%", 'display': 'inline-block'})
] #stockScenario
),
# html.Label(children=[dcc.Checklist(id = "seed",
# options=[{'label': 'New Brownian motion', 'value': "seed"}],
# value=[],
# labelStyle={'font-weight': 'bold', "text-align":"left", 'display': 'inline-block'}
# )],
# title=list_input["Seed"]),
#
#
html.Br(),
html.A('Download Data', id='download-link', download="rawdata.csv", href="", target="_blank"),
# html.P("""Note: requires excel decimal separator to be a dot.""", style={"font-size":12}),
])),
],),], style={'float': 'left', 'width': '25%', 'margin':"30px"}),
])
def ExperimentResults():
layout = html.Div([
Navbar(),
dcc.Interval(
id='interval-component',
interval=5 * 1000, # in milliseconds
n_intervals=0),
html.H3("Filter weight distributions"),
html.Div([
html.P("Select experiment"),
dcc.Dropdown(id="experiment-dropdown",
options=[{
"label": f"{x[1]}",
"value": f"{x[1]}"
} for x in list(map(lambda x: os.path.split(x), logs))
])
],
style={"width": "20%"}),
dbc.Row([
dbc.Col([
html.P("Select layer for filter distribution visualization:"),
dcc.Dropdown(id="filter-vis-layers", options=[], value=[])
]),
dbc.Col([
html.P("Epoch slider"),
dcc.Slider(id='epoch-slider',
min=0,
max=0,
step=1,
value=0,
updatemode="drag")
])
]),
html.Img(id='filter-distribution-image',
style={
'height': '500px',
'width': '500px'
}),
html.H3("Activations"),
dcc.Dropdown(id="activation-vis-samples", options=[], value=[]),
dcc.Dropdown(id="activation-vis-layers", options=[], value=[]),
dcc.Slider(id='epoch-slideract-vis',
min=0,
max=0,
step=1,
value=0,
updatemode="drag"),
html.Div(id="activation-images"),
html.H3("Train and validation metrices"),
dcc.Slider(id='moving-average-slider',
min=100,
max=5000,
step=100,
value=100,
updatemode="drag"),
dbc.Row([
dbc.Col(html.Div(id="train-graph")),
dbc.Col(html.Div(id="train-accuracy-graph"))
]),
dbc.Row([
dbc.Col(html.Div(id="val-graph")),
dbc.Col(html.Div(id="val-accuracy-graph"))
])
])
return layout
'value': i
} for i in ['Linear', 'Log']],
value='Linear',
labelStyle={'display': 'inline-block'})
],
style={
'width': '48%',
'float': 'right',
'display': 'inline-block'
})
]),
dcc.Graph(id='indicator-graphic'),
dcc.Slider(id='year--slider',
min=df['Year'].min(),
max=df['Year'].max(),
value=df['Year'].max(),
marks={str(year): str(year)
for year in df['Year'].unique()},
step=None)
])
@app.callback(Output('indicator-graphic', 'figure'),
Input('xaxis-column', 'value'), Input('yaxis-column', 'value'),
Input('xaxis-type', 'value'), Input('yaxis-type', 'value'),
Input('year--slider', 'value'))
def update_graph(xaxis_column_name, yaxis_column_name, xaxis_type, yaxis_type,
year_value):
dff = df[df['Year'] == year_value]
fig = px.scatter(
def all_layouts(self):
# Main plot
graph = html.Div(
[
dcc.Graph(
figure=go.Figure(layout=XRayDiffractionComponent.empty_plot_style),
id=self.id("xrd-plot"),
config={"displayModeBar": False},
)
]
)
# Radiation source selector
rad_source = html.Div([
html.P("Radiation Source"),
dcc.Dropdown(
id=self.id("rad-source"),
options=[
{"label": i, "value": i} for i in self.WAVELENGTHS.keys()
],
value="CuKa",
placeholder="Select a source...",
clearable=False
)
], style={'max-width':'200'}
)
# Shape factor input
shape_factor = html.Div(
[
html.P("Shape Factor, K "),
dcc.Input(
id=self.id("shape-factor"),
placeholder='0.94',
type='text',
value='0.94'
)
],style={'max-width':'200'}
)
# Peak profile selector (Gaussian, Lorentzian, Voigt)
peak_profile = html.Div([
html.P("Peak Profile"),
dcc.Dropdown(
id=self.id("peak-profile"),
options=[
{"label":'Gaussian',"value":'G'},
{"label":'Lorentzian',"value":'L'},
{"label":'Voigt',"value":'V'}
],
value="G",
clearable=False
)
], style={'max-width':'200'}
)
# Crystallite size selector (via Scherrer Equation)
crystallite_size = html.Div(
[
html.P("Scherrer Crystallite Size (nm)"),
html.Div([
dcc.Slider(
id=self.id("crystallite-slider"),
marks={i: '{}'.format(10 ** i) for i in range(-1,3)},
min=-1,
max=2,
value=0,
step=0.01
),
], style={'max-width':'500'}),
html.Div([
],id=self.id("crystallite-input"),style={"padding-top":"20px"})
]
)
return {"graph": graph,
"rad_source": rad_source,
"peak_profile": peak_profile,
"shape_factor": shape_factor,
"crystallite_size": crystallite_size
}
def execute(self):
"""Execute the link.
:returns: status code of execution
:rtype: StatusCode
"""
settings = process_manager.service(ConfigObject)
ds = process_manager.service(DataStore)
ds[self.col_key] = ds[self.read_key].columns.values
base_path = os.path.join(os.path.dirname(__file__), '../../../data/'+self.label_key)
ds[self.label_key] = pickle.load(open(base_path, 'rb'))
ds[self.hue_key] = self.hue_cols
stats = statistics.ArrayStats(ds[self.read_key].iloc[:, 0].values,
ds[self.read_key].columns[0],
label=ds[self.label_key][ds[self.read_key].columns[0]])
stats.create_stats()
input_stats = pd.DataFrame.from_dict(stats.stat_vals, orient='columns').T.drop(1, 1)*0
input_stats.reset_index(inplace=True)
input_stats.columns = ['Variable', 'Value']
self.initial_stats = input_stats
# --- your algorithm code goes here
self.logger.debug('Now executing link: {link}.', link=self.name)
print('-'*20, '!!!')
print(os.path.abspath(__file__))
app = dash.Dash(__name__, assets_folder=os.path.join(os.path.dirname(__file__), '../../../macros/assets/'),)
app.layout = html.Div([
html.H1('DataFrames: a summary'),
html.Div([ # -- the row
html.Div([ # -- first column
html.H5("Variable"),
dcc.Dropdown(id='x_dropdown',
options=[{'label': ds[self.label_key][x],
'value': x} for x in ds[self.col_key]],
value=0, placeholder='Select...',
style={'width': '100%'}),
html.H5("Hue"),
dcc.Dropdown(id='hue_dropdown',
options=[{'label': ds[self.label_key][x],
'value': x} for x in ds[self.hue_key]],
value=0, placeholder='Select...',
style={'width': '100%'}), ], className='two columns'),
html.Div([ # -- second column
html.Div([
dcc.Graph(id='histogram',
figure={'layout': go.Layout(plot_bgcolor=self.plt_bgcolor,
paper_bgcolor=self.plt_papercolor,
font=dict(color=self.text_color),
title='Histogram'
)}),
dcc.Slider(id='bin_slider1',
min=1,
max=100,
step=1,
value=30,
updatemode='drag',
marks={x: {'label': str(x)} for x in range(0, 100, 10)}),
])], className='six columns'),
html.Div([ # -- third column
html.Div([
dash_table.DataTable(id='table',
columns=[{"name": i, "id": i} for i in self.initial_stats],
data=self.initial_stats.to_dict('rows'),
style_as_list_view=True,
style_header={
'backgroundColor': self.plt_papercolor,
'color': 'white', },
style_cell={
'backgroundColor': self.plt_bgcolor,
'color': 'white'}, )
],
className='offset-by-one columns', style={'width': '20%', })]
),
], className='row'),
])
@app.callback(dash.dependencies.Output('histogram', 'figure'),
[dash.dependencies.Input('x_dropdown', 'value'),
dash.dependencies.Input('hue_dropdown', 'value'),
dash.dependencies.Input('bin_slider1', 'value')])
def update_plot(value_x, hue, bins):
import seaborn as sns
if hue is None:
hue = 0
if value_x is None:
value_x = 0
df = ds[self.read_key]
if value_x == 0:
return {'data': [],
'layout':go.Layout(
xaxis={'title': 'Please select a variable'},
plot_bgcolor=self.plt_bgcolor,
paper_bgcolor=self.plt_papercolor,
font=dict(color=self.text_color),
title='Histogram')}
elif hue != 0:
pal = sns.palettes.color_palette('YlGnBu', n_colors=len(df[hue].unique()))
pal = pal.as_hex()
return {'data': [go.Histogram(
x=df.loc[df[hue] == col, value_x],
nbinsx=bins,
name=str(col),
marker=dict(color=pal[i]),
text=df[value_x])
for i, col in enumerate(df[hue].unique())],
'layout': go.Layout(
xaxis={'title': ds[self.label_key][value_x]},
plot_bgcolor=self.plt_bgcolor,
paper_bgcolor=self.plt_papercolor,
font=dict(color=self.text_color),
title='Histogram'),}
else:
return {'data': [go.Histogram(
x=df[value_x],
nbinsx=bins,
text=df[value_x])],
'layout': go.Layout(
xaxis={'title': ds[self.label_key][value_x]},
plot_bgcolor=self.plt_bgcolor,
paper_bgcolor=self.plt_papercolor,
font=dict(color=self.text_color),
title='Histogram'
)}
@app.callback(dash.dependencies.Output('table', 'data'),
[dash.dependencies.Input('x_dropdown', 'value')])
def update_table(value_x):
if value_x is None:
stats = statistics.ArrayStats(ds[self.read_key].iloc[:,0].values,
value_x,
label='fake')
stats.create_stats()
input_stats = pd.DataFrame.from_dict(stats.stat_vals, orient='columns').T.drop(1, 1)
input_stats *= 0
input_stats.reset_index(inplace=True)
input_stats.columns = ['Variable', 'Value']
return input_stats.to_dict('rows')
elif value_x != 0:
stats = statistics.ArrayStats(ds[self.read_key].loc[:, value_x].values,
value_x,
label=ds[self.label_key][value_x])
stats.create_stats()
input_stats = pd.DataFrame.from_dict(stats.stat_vals, orient='columns').T.drop(1, 1)
input_stats.reset_index(inplace=True)
input_stats.columns = ['Variable', 'Value']
return input_stats.to_dict('rows')
# return input_stats.describe().to_dict('rows')
ds[self.app_store_key] = app
return StatusCode.Success
build_banner(),
html.H1("Directividad parlante B&D 6MD38", style={'text-align': 'center'}),
daq.Gauge(id='knob',
label="Angulo de incidencia",
color="#42ADDC",
value=0,
min=-135,
max=135,
scale={
'start': -135,
'labelInterval': 45,
'interval': 1
},
theme='Light',
showCurrentValue=True),
dcc.Slider(id='slider', min=-90, max=90, step=10, value=0),
html.Br(),
dcc.Graph(id='rta', figure={})
])
@app.callback(
[Output('knob', 'value'), Output('rta', 'figure')],
[Input('slider', 'value')])
def update_output(value):
dff = df.copy()
fig = px.line(dff,
x="Frecuencia",
y=str(value),
},
),
],
style={"width": "100%"},
align='center'),
],
color="primary",
style={'marginBottom': '1em'})
body = html.Div(
html.Div([
html.Div(id='live-update-text'),
dcc.Slider(
id='time-slider',
min=1,
max=24,
step=1,
value=datetime.datetime.now().hour,
),
html.Div(children=[
dcc.Graph(id="map-graph", style={'height': '75vh'}),
],
style={
'height': '75vh',
'marginBottom': '1em'
}),
html.Div(id='data_table'),
html.Div(id='polar_plot'),
dcc.Interval(
id='interval-component',
interval=1 * 1000, # in milliseconds
app.layout = html.Div([
html.H1("Signaux physio Eduquées Stressées"),
html.Div(
[
html.Div([
html.H3([
"Dyade " + ":",
]),
html.P([
dcc.Dropdown(id="dyade", options=dyade_options, value=1)
]),
html.P([
"Nombre de sommets" + ":",
]),
html.P([
dcc.Slider(id="num_peaks", min=0, max=15, step=1, value=5)
]),
html.P(["", dcc.Input(id="num_peaks_disp", readOnly=True)]),
],
style={'padding': 20}),
html.P(["HR mean " + ":",
dcc.Input(id="hr_moy", readOnly=True)]),
html.P(["HR std " + ":",
dcc.Input(id="hr_std", readOnly=True)]),
],
style={
"width": "15%",
"float": "left"
},
),
html.Div([
# dbc.Col([
# html.Img(src="assets/MIT-logo-red-gray-72x38.svg", alt="MIT Logo", height="30px"),
# ], width=1)
],
align="end"),
html.Hr(),
dbc.Row([
dbc.Col([
html.Div([
html.H5("Key Parameters"),
html.P("Number of booms:"),
dcc.Slider(id='n_booms',
min=1,
max=3,
step=1,
value=3,
marks={
1: "1",
2: "2",
3: "3",
}),
html.P("Wing Span [m]:"),
dcc.Input(id='wing_span', value=43, type="number"),
html.P("Angle of Attack [deg]:"),
dcc.Input(id='alpha', value=7.0, type="number"),
]),
html.Hr(),
html.Div([
html.H5("Commands"),
dbc.Button("Display (1s)",
id="display_geometry",
color="primary",
column2 = dbc.Col(
[
dcc.Markdown('## Predictions', className='mb-5'),
dcc.Markdown('#### Title'),
dcc.Input(
id='film',
placeholder='Movie title here',
type='text',
value=''
),
dcc.Markdown('#### Year'),
dcc.Slider(
id='year',
min=1945,
max=2015,
step=1,
value=1995,
marks={n: str(n) for n in range(1945,2015,10)},
className='mb-5',
),
dcc.Markdown('#### Body Count'),
dcc.Slider(
id='body_count',
min=1,
max=1000,
step=1,
value=75,
marks={n: str(n) for n in range(0,1000,50)},
className='mb-5',
),
dcc.Markdown('#### Length (in minutes)'),
clearable=False,
# multi=True,
# disabled=True,
placeholder='Select record types'),
className="four columns",
),
html.Div(
html.P('# records'),
className="one columns",
),
html.Div(
dcc.Slider(
id='slider-updatemode',
marks={i - 2: '{}'.format(10**i)
for i in range(2, 6)},
max=3,
value=2,
step=0.01,
updatemode='drag',
),
className="three columns",
style={"marginLeft": "10"},
),
],
className="row",
style={"marginBottom": "10"},
),
# indicators row div
html.Div(
[
'''),
dcc.Dropdown(id='occ-dropdown', options=options, value='11-3051.03'),
html.Label(id='my_label1'),
html.Div(id='occ-output-container'),
html.Br(),
dcc.Markdown('''
**Select importance of job ability requirements:**
'''),
dcc.Slider(id='a1',
min=0,
max=1,
value=0.5,
step=.05,
marks={
0: 'Not important',
0.5: 'Somewhat important',
1: 'Very important'
}),
html.Br(),
dcc.Markdown('''
**Select importance of job skill requirements:**
'''),
dcc.Slider(id='a2',
min=0,
max=1,
value=0.5,
step=.05,
years = sorted(list(df.year.unique()))
app.layout = html.Div([
html.Div([
html.Div([
dcc.Graph(id='graph-left', animate=True),
],
className='six columns'),
html.Div([dcc.Graph(id='graph-right', animate=True)],
className='six columns')
],
className='row'),
dcc.Slider(
id='year-slider',
marks={i: str((str(i) if (i - 2) % 10 == 0 else ''))
for i in years},
value=1952,
min=years[0],
max=years[-1])
])
# Common figure generation function shared by both callbacks
def create_figure(year, selectedData, hoverData, yaxis_column):
if selectedData is None:
selectedData = {'points': []}
if hoverData is None:
hoverData = {'points': []}
filtered_countries = set([
point['customdata']
for point in selectedData['points'] + hoverData['points']
options=teams,
placeholder="Select a Season",
style=season_style),
html.Div(id='slider-title',
children='''
Select Game:
''',
style={
"color": "white",
"margin-bottom": "1px",
'font-size': 20
}),
dcc.Slider( #slider to select game
id='game-range',
min=10,
max=20,
step=1,
value=10,
)
],
style={
"position": 'center',
"margin-left": "50px",
"margin-bottom": "30px",
'width': '100%',
'display': 'inline-block'
}),
html.Div(
[ #team data table handling current standings
html.H1(children='Team Standings',
style={
import dash
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Input, Output
app = dash.Dash(__name__)
# ➊ レイアウト
app.layout = html.Div(
[
html.H1(id="callback-output"),
# 引数updatemodeに"drag"を渡し,動作を即座に反映するように設定
dcc.Slider(id="callback-input", value=0, updatemode="drag"),
],
style={"textAlign": "center", "width": "60%", "margin": "auto"},
)
# ➋ コールバック
@app.callback(
# ➌ 出力項目を指定,ID,属性を渡す
Output("callback-output", "children"),
# ➍ 入力項目を指定,ID,属性を渡す
Input("callback-input", "value"),
)
# ➎ コールバック関数
def update_app(num_value):
return num_value
if __name__ == "__main__":
app.run_server(debug=True)
dcc.Dropdown(
id='yaxis1',
options=[{'label': i, 'value': i} for i in available_indicators],
value='Wages and salaries'
)
],style={'width': '30%', 'float': 'right', 'display': 'inline-block'})
]),
#Give graph a unique name grph1 in order to be able to have both graphs on my dashboard
dcc.Graph(id='grph1'),
#Create slider, in order to manipulate position made it as a html and with style aligned it with the graph itself
html.Div(dcc.Slider(
id='year--slider',
min=euro_data['TIME'].min(),
max=euro_data['TIME'].max(),
value=euro_data['TIME'].max(),
step=None,
marks={str(time): str(time) for time in euro_data['TIME'].unique()},
), style={'marginRight': 50, 'marginLeft': 110},),
#Create the environment for second chart following the same steps as before
html.Div([
html.Div([
dcc.Dropdown(
#Use xaxis2 as my id to prevent the dropdown from previous graph to interact with this axis and vice-versa
id='xaxis2',
options=[{'label': i, 'value': i} for i in available_indicators],
value='Gross domestic product at market prices'
id="label-class-buttons",
children=[
html.Button(
"%2d" % (n,),
id={"type": "label-class-button", "index": n},
style={"background-color": class_to_color(c)},
)
for n, c in enumerate(class_labels)
],
),
html.H6(id="stroke-width-display"),
# Slider for specifying stroke width
dcc.Slider(
id="stroke-width",
min=0,
max=6,
step=0.1,
value=DEFAULT_STROKE_WIDTH,
),
# Indicate showing most recently computed segmentation
dcc.Checklist(
id="show-segmentation",
options=[
{
"label": "Show segmentation",
"value": "Show segmentation",
}
],
value=[],
),
html.H6("Features"),
def Add_Dash(server):
"""Create a Dash app."""
external_stylesheets = [
'/static/dist/css/styles.css',
'https://fonts.googleapis.com/css?family=Lato',
'https://use.fontawesome.com/releases/v5.8.1/css/all.css'
]
external_scripts = [
'/static/dist/js/includes/jquery.min.js', '/static/dist/js/main.js'
]
# server = flask.flask(__name__)
# app = dash.Dash(__name__, requests_pathname_prefix='/lda/', external_stylesheets=[dbc.themes.BOOTSTRAP])
# app.layout = html.Div(children=[navbar, body])
# def Add_Dash(server):
# return dash_app.server
dash_app = Dash(
server=server, #external_stylesheets=[dbc.themes.BOOTSTRAP],
external_stylesheets=external_stylesheets,
external_scripts=external_scripts,
routes_pathname_prefix='/word_cloud/')
dash_app.index_string = html_layout
"""
# Page layout and contents
"""
global_df = load_data()
left_column = dbc.Jumbotron([
html.H4(children="Select host & dataset size", className="display-5"),
html.Hr(className="my-2"),
html.Label(
"Select percentage of dataset (higher is more accurate but also slower)",
className="lead",
),
dcc.Slider(
id="n-selection-slider",
min=1,
max=100,
step=1,
marks=make_n_marks(),
value=10,
),
# html.Div([
# dcc.Markdown(''' --- ''')]),
html.Label("\n\nSelect a host",
style={"marginTop": 100},
className="lead"),
dcc.Dropdown(id="bank-drop",
clearable=False,
style={"marginBottom": 50}),
html.Label("Select Conflict Score", className="lead"),
html.Div(dcc.RangeSlider(id="time-window-slider",
min=0,
max=0.3,
step=None,
marks={
0: '0',
0.01: '1',
0.05: '2',
0.1: '3',
0.2: '4',
0.3: '5',
},
value=[0.1, 0.3]),
style={"marginBottom": 50}),
])
lda_plot = dcc.Loading(id="loading-lda-plot",
children=[dcc.Graph(id="tsne-lda")],
type="default")
lda_table = dcc.Loading(
id="loading-lda-table",
children=[
dash_table.DataTable(
id="lda-table",
style_cell_conditional=[{
"if": {
"column_id": "Text"
},
"textAlign": "left",
"height": "auto",
"width": "50%",
}],
style_cell={
"padding": "5px",
"overflow": "hidden",
"textOverflow": "ellipsis",
"maxWidth": 0,
},
style_header={
"backgroundColor": "white",
"fontWeight": "bold"
},
style_data={
"whiteSpace": "normal",
"height": "auto"
},
filter_action="native",
page_action="native",
page_current=0,
page_size=5,
columns=[],
data=[],
)
],
type="default",
)
wordcloud_plots = [
dbc.CardHeader(html.H5("Most popular words in reference titles")),
dbc.CardBody([
dbc.Row([
dbc.Col(
dcc.Loading(
id="loading-wordcloud",
children=[dcc.Graph(id="bank-wordcloud")],
type="default",
),
md=8,
),
dbc.Col(
dcc.Loading(
id="loading-frequencies",
children=[dcc.Graph(id="frequency_figure")],
type="default",
)),
])
]),
]
top_banks_plot = [
dbc.CardHeader(html.H5("Top 20 domains")),
dbc.CardBody([
dcc.Loading(
id="loading-banks-hist",
children=[dcc.Graph(id="bank-sample")],
type="default",
)
]),
]
body = dbc.Container(
[
dbc.Row(
[
dbc.Col(left_column, md=5, align="center"),
],
style={"margin": "auto"},
),
dbc.Card(
[dbc.Col(wordcloud_plots)],
style={"margin": "auto"},
),
# dbc.Row([dbc.Col([lda_plot, lda_table])]),
],
className="mt-12",
)
dash_app.layout = html.Div(children=[body])
"""
# Callbacks
"""
@dash_app.callback(
[
# Output("time-window-slider", "marks"),
# Output("time-window-slider", "min"),
# Output("time-window-slider", "max"),
# Output("time-window-slider", "step"),
Output("time-window-slider", "value"),
],
[Input("n-selection-slider", "value")],
)
def populate_time_slider(value):
# print("repopulating time-window-slider")
max_date, min_date = calculate_dates(global_df)
print(max_date, min_date)
print('4/df_tables.ratio.max() --------------------- \n\n\n\n\n',
df_tables['Date received'].max())
print(make_marks(min_date, max_date), int(min_date), max(min_date), 1,
[int(min_date), int(max_date)])
return ([int(min_date), int(max_date)], )
@dash_app.callback(Output("bank-drop", "options"),
[Input("time-window-slider", "value")])
def populate_bank_dropdown(time_values):
print("bank-drop: TODO USE THE TIME VALUES TO LIMIT THE DATASET")
values, counts = calculate_full(global_df)
values = global_df.Company.head(100)
# print("repopulating dropdown")
return make_options(values)
@dash_app.callback(
[
Output("bank-wordcloud", "figure"),
Output("frequency_figure", "figure")
],
[
# Input("bank-sample", "clickData"),
Input("bank-drop", "value"),
Input("time-window-slider", "value"),
Input("n-selection-slider", "value"),
],
)
def update_wordcloud(value_drop, time_values, n_selection):
if value_drop:
selected_bank = value_drop
# elif value_click:
# selected_bank = value_click["points"][0]["x"]
else:
return {}, {}
print("redrawing bank-wordcloud...")
n = float(n_selection / 100)
print('n_selection ------------------------\n', n_selection)
print('n\n', n)
print("got time window:", str(time_values))
print("got n_selection:", str(n_selection), str(n))
# sample the dataset according to the slider
df_tables = load_data_all(selected_bank)
local_df = sample_data(df_tables, n)
if time_values is not None:
# local_df["Date received"] = local_df["Date received"]
local_df = local_df[(local_df["Date received"] >= time_values[0])
&
(local_df["Date received"] <= time_values[1])]
local_df = local_df[local_df["Company"] == selected_bank]
add_stopwords(selected_bank)
wordcloud, frequency_figure = plotly_wordcloud(local_df)
print("redrawing bank-wordcloud...done")
return (wordcloud, frequency_figure)
return dash_app.server
'height': '60px',
'lineHeight': '60px',
'borderWidth': '1px',
'borderStyle': 'dashed',
'borderRadius': '5px',
'textAlign': 'center',
'margin': '10px'
},
# Allow multiple files to be uploaded
multiple=True),
html.Label('Epsilon'),
dcc.Slider(
id='epsilon',
min=0.01,
max=0.1,
step=0.01,
marks=dict(
zip([i for i in np.arange(0.01, 0.11, 0.01)],
[str(round(i, 3)) for i in np.arange(0.01, 0.11, 0.01)])),
value=0.01,
included=False),
html.Div(id='shapes', children=[], style={'display': 'none'}),
html.Div([
html.Label('original image',
style={
'width': '33%',
'display': 'inline-block'
}),
html.Div(id='show-choosed-epsilon-text',
children=[],
style={
'width': '33%',
{'label': 'New York City', 'value': 'NYC'},
{'label': 'Montréal', 'value': 'MTL'},
{'label': 'San Francisco', 'value': 'SF'}
],
multi=True,
value="MTL"
)''',
style=styles.code_container),
html.Br(),
dcc.Link('More Dropdown Examples and Reference',
href=tools.relpath("/dash-core-components/dropdown")),
html.Hr(),
html.H2(
dcc.Link('Slider',
href=tools.relpath('/dash-core-components/slider'))),
rc.ComponentBlock('''import dash_core_components as dcc
dcc.Slider(
min=-5,
max=10,
step=0.5,
value=-3
)''',
style=styles.code_container),
rc.ComponentBlock('''import dash_core_components as dcc
dcc.Slider(
min=0,
max=9,
marks={i: 'Label {}'.format(i) for i in range(10)},
value=5,
# adds a negated version of every filter
filterFunctions['not_' + name] = _negate(func)
# lays out the basic HTML along with the interactive components
INITIAL_LAYOUT = html.Div(children=[
# TODO data filter checkbox
html.Div(children=[
html.Div(children=[
# TODO Note: UI cannot be customized as Dash does not support all HTML tags
html.Div(children=[
dcc.Slider(
id='vertical slider',
min=0,
max=2,
marks={i: m for i, m in enumerate(FILTER_CHOICES)},
included=False,
step=None,
vertical=True,
value=0,
),
],
style={'height': 100},
),
],
style={'position': 'absolute', 'left': '40', 'top': '200'}
)
],
),
# displays the data, controlled by the callback function 'updateGraph'
# defined below
n_clicks=0,
style={
'text-align': 'center',
'fontSize': 25,
'backgroundColor': colors['background'],
'marginBottom': '4%',
'marginTop': '2%',
'height': '50px',
'color': 'crimson'
}),
]),
]),
dcc.Slider(
id='my-slider',
min=0,
max=100,
step=5,
value=20,
),
html.Div(id="first-two-names",
children=[
html.Div(style={
'width': '50%',
'height': '50%',
'display': 'inline-block',
'fontSize': 30,
'height': '50px',
'marginTop': '2.8%'
},
children=[
html.Div(children='BUBBLE SORT',
def options_layout(self, inital_args_kwargs):
options = html.Div([
html.Div([
Label("Rotation axis"),
dcc.Input(
value="[1, 0, 0]",
id=self.id("gb_rotation_axis"),
type="text",
className="input",
),
]),
html.Br(),
html.Div([
Label("Choose Σ"),
dcc.Dropdown(
id=self.id("gb_sigma_options"),
options=[],
placeholder="...",
),
]),
html.Br(),
html.Div([
Label("Choose rotation angle"),
dcc.Dropdown(
id=self.id("gb_rotation_options"),
options=[],
placeholder="...",
),
]),
html.Br(),
html.Div([
Label("Grain width"),
dcc.Slider(
id=self.id("gb_expand_times"),
min=1,
max=6,
step=1,
value=2,
marks={
2: "2",
4: "4",
6: "6"
},
),
]),
html.Br(),
html.Div([
Label("Distance between grains in Å"),
dcc.Input(
value="0.0",
id=self.id("gb_vacuum_thickness"),
type="text",
className="input",
),
]),
html.Br(),
html.Div([
Label("Plane"),
dcc.Input(
value="None",
id=self.id("gb_plane"),
type="text",
className="input",
),
]),
])
return options
import dash_core_components as dcc
import dash_html_components as html
import dash_bootstrap_components as dbc
from app.components import filter_layout
year_slider_component = dcc.Slider(
id='year-slider',
min=2010,
max=2019,
step=1,
value=2019,
tooltip={"always_visible": True},
marks={
2010: "2010",
2019: "2019"
},
)
year_slider = filter_layout.create_filter_layout("Izberi leto",
year_slider_component)
aggregate_value_dropdown = html.Div(children=[
dbc.Row(children=[dbc.Col(children=[html.H4("Primerjaj glede na")])]),
dbc.Row(children=[
dbc.Col(children=[
dcc.Dropdown(id="aggregate-value-radio",
options=[{
'label': 'Celotna vrednost receptov',
'value': 'Celotna vrednost receptov'
all_races = RASSE[:race_count]
all_races_count = []
for race in all_races:
all_races_count.append(int(dff[dff['RASSE1'] == race]['dog_count']))
if len(all_races) >= race_count:
all_races = np.append(all_races, ['Sonstige'])
not_popular_dogs = dff[~dff['RASSE1'].isin(all_races)]
all_races_count.append(not_popular_dogs.sum().iloc[2])
fig = go.Figure()
fig.add_trace(go.Pie(labels=all_races, values=all_races_count))
return fig
title = html.H2('Race Distribution', className='col-md-6')
input = html.Div(className='col-md-6',
children=[
dcc.Slider(id='select-race-count',
min=1,
max=100,
step=1,
value=7),
dcc.Dropdown(id='select-year',
options=years,
multi=False,
value=2016),
])
output = dcc.Graph(id='dog-races', className='col-md-6', figure={})
'thomas': 8596359061997376531,
'marsh water table': 3390197892757083161}
layout = html.Div(children=[
html.Div([html.Link(href='/static/whitey.css', rel='stylesheet')]),
dcc.Markdown('''
# Network Health
App to monitor health of the wireless network. It keeps track of units battery level, signal quality (RSSI), and latest commit of data to the Meshpi
## Graph settings
### 1. Number of days since today to display
'''),
dcc.Slider(id='ndays', min=0, max=300, step=10, value=15, marks={i: '{} days'.format(i) for i in range(5, 290, 5)}),
html.Div(id='output_graphs_health'),
dcc.Markdown('''
---
## Return to [Home](index)
''')
])
@app.callback(
Output(component_id='output_graphs_health', component_property='children'),
[Input(component_id='ndays', component_property='value')]
)
def update_graph_table_flux(input_ndays):
df = get_data(input_ndays)
slider_top_breweries_values = [5, 25, 50, 75, 100, 125, 150, 175, 200]
controls = dbc.Card(
[
dbc.CardBody(
[
dbc.FormGroup(
[
dbc.Label("Временной период", style={'text-align': 'center', 'font-size': '100%',
'font-family': 'Proxima Nova Regular',
'text-transform': 'uppercase'}
),
dcc.Slider(
id='slider-day',
min=1,
max=100,
step=10,
value=100,
marks={i: i for i in slider_day_values}
),
], style={'text-align': 'center'}
),
dbc.FormGroup(
[
dbc.Label("Количество пивоварен", style={'text-align': 'center', 'font-size': '100%',
'font-family': 'Proxima Nova Regular',
'text-transform': 'uppercase',
}
),
dcc.Slider(
id='slider-top-breweries',
min=5,
