Hello,
I would like to make a dashboard for stocks with KPIs, fundamentals etc. I am trying to create a container - for the KPIs, that updates automatically according to changes made in the tickers list using the plotly.graph_objects.Indicator class. Please note that the KPIs will be just one part of the dashboard, just like in the image below: KPIs will be on #1.
import dash
import dash_bootstrap_components as dbc
from dash import dcc
import plotly.graph_objects as go
import math
import yfinance as yf
import plotly.subplots as subplots
# List of tickers for the stocks you want to include in the chart
tickers = ["AAPL","MSFT","TSLA","GOOG"]
# Create a dataframe with the stock data
stock_data = yf.download(tickers, period='max')
# Calculate the number of rows and columns needed to fit all the tickers
num_rows = math.ceil(len(tickers) / 4)
num_cols = 4
# Create a grid of domain subplots
fig = subplots.make_subplots(
rows=num_rows,
cols=num_cols,
specs=[[{"type": "domain"}] * num_cols] * num_rows
)
# Loop through the tickers and add an indicator to each subplot
for i, ticker in enumerate(tickers):
fig.add_trace(go.Indicator(
mode = "number+delta",
value = stock_data['Adj Close'][ticker][-1],
title = {"text": ticker,"font":{'color':'white'}},
delta = {"reference": stock_data['Adj Close'][ticker][-2]},
number={"font":{"size":40 ,'color':'white'}}
), row=i // num_cols + 1, col=i % num_cols + 1)
fig.update_layout(
autosize=True,
height=800,
width=800,
margin=dict(l=100,r=100,t=100,b=100),
grid = {'rows': num_rows,
'columns': num_cols,
'pattern': "independent"})
fig.update_layout({
'plot_bgcolor': 'rgba(0, 0, 0, 0)',
'paper_bgcolor': 'rgba(30,67,74,255)',
})
app = dash.Dash(external_stylesheets=[dbc.themes.SLATE])
app.layout = dbc.Container(
[
dbc.Card(
[
dbc.CardBody(dcc.Graph(figure=fig))
],style={"width": "auto"}
)]
)
if __name__ == "__main__":
app.run_server(debug=True)
I appreciate any help.
Thank you.