diff --git a/assets/style.css b/assets/style.css index 27aa47b..ac67f89 100755 --- a/assets/style.css +++ b/assets/style.css @@ -245,7 +245,7 @@ a:hover { display: inline-block; height: 38px; padding: 0 30px; - color: #555; + color: #fff; text-align: center; font-size: 11px; font-weight: 600; @@ -485,7 +485,7 @@ a { padding-bottom: 12px; } .Select-control, .Select-menu-outer, .Select-multi-value-wrapper, .select-up, .is-open .Select-control { - background-color: #1E1E1E; + background-color: #1E1E1E !important; color: white; } @@ -631,4 +631,28 @@ a { /* Handle on hover */ ::-webkit-scrollbar-thumb:hover { background: #d8d8d870 !important; +} + + +/* OWN STYLES */ + +.gauges{ + display: flex; + flex-wrap: wrap; +} + +#average_gauge{ + flex-grow: 1; +} + +#tab-1, #tab-2{ + background-color: #1E1E1E; + color: #fff; + border-left: none; + border-right: none; + border-bottom: none; +} + +.tab--selected{ + background-color: #111111 !important; } \ No newline at end of file diff --git a/finance.py b/finance.py index f31cb04..a81732b 100755 --- a/finance.py +++ b/finance.py @@ -4,7 +4,7 @@ import dash_core_components as dcc import dash_table import plotly.express as px import yfinance as yf -from dash.dependencies import Input, Output +from dash.dependencies import Input, Output, State import plotly.graph_objects as go import numpy as np import pandas as pd @@ -111,17 +111,24 @@ app.layout = html.Div( html.Div( className='div-for-dropdown', children=[ - dcc.Dropdown(id='table_selector', + dcc.Dropdown(id='table_selector', options=get_options(stock_list), multi=False, value=selected_stock_in_table, style={'backgroundColor': '#1E1E1E'}, className='stockselector' - ) + ), + html.Button("Pobierz dane", id="btn_data",style={'margin-top': '3rem'}), + dcc.Download(id="download-data") + ], style={'color': '#1E1E1E'}), html.P('Wybierz przedział czasu by policzyć średnie i wachania'), - dcc.Graph(id='average_gauge'), - dcc.Graph(id='volatility_gauge'), + html.Div( + className='gauges', + children=[ + dcc.Graph(id='average_gauge'), + dcc.Graph(id='volatility_gauge') + ]), dash_table.DataTable( id='info_in_time_period', style_header={'backgroundColor': 'rgb(30, 30, 30)'}, @@ -133,7 +140,14 @@ app.layout = html.Div( ]), html.Div(className='eight columns div-for-charts bg-grey', children=[ - dcc.Graph(id='timeseries', config={'displayModeBar': False}, animate=True), + dcc.Tabs(id='tabs', value='tab-1', children=[ + dcc.Tab(id='tab-1', label='Chart 1', value='tab-1', children=[ + dcc.Graph(id='timeseries', config={'displayModeBar': False}, animate=True), + ]), + dcc.Tab(id='tab-2', label='Chart 2', value='tab-2',children=[ + dcc.Graph(id='price-dividends', config={'displayModeBar': False}, animate=True), + ]), + ]), dash_table.DataTable( id='stock_price_table', style_header={'backgroundColor': 'rgb(30, 30, 30)'}, @@ -147,6 +161,16 @@ app.layout = html.Div( ] ) +# Callback for downloading file +@app.callback( + Output("download-data", "data"), + Input("btn_data", "n_clicks"), + State('table_selector', 'value'), + prevent_initial_call=True, +) +def create_download_file(n_clicks, selected_table): + global selected_stock_in_table_df + return dcc.send_data_frame(selected_stock_in_table_df.to_csv, "data-{table}.csv".format(table = selected_table)) # Callback for timeseries price @app.callback(Output('timeseries', 'figure'), [Input('stockselector', 'value')]) @@ -227,6 +251,12 @@ def change_time_period(selectedData): volatility_gauge = make_gauge('wolatylność', 0, std['Close'], 400) return average_gauge, volatility_gauge, stock_info_in_time_period_df.T.to_dict('records') +@app.callback(Output('price-dividends', 'figure'), + [Input('table_selector', 'value')]) +def update_point_chart(selected_dropdown_value): + selected_stock_in_table_df = fullTableDf.xs(selected_dropdown_value, axis=1, level=1) + figure = px.scatter(selected_stock_in_table_df, x='Dividends', y='Close', template='plotly_dark') + return figure if __name__ == '__main__': app.run_server(debug=True)