Py.Cafe

nataliatsyporkin/

Electricity

Electricity Demand Dashboard Using Dash and Plotly

DocsPricing
  • assets/
  • pages/
  • app.py
  • chart_functions.py
  • data.py
  • requirements.txt
app.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
import dash
from dash import Dash, dcc, html , get_relative_path
import dash_bootstrap_components as dbc


# Create app object=================================================================
app = Dash(__name__,
           use_pages=True, 
           external_stylesheets=[dbc.themes.CYBORG,                                  
                                 dbc.icons.FONT_AWESOME] )         
#===================================================================================

 
# Create popover for data not available
popover_content=dcc.Markdown("""
    Data not available for the period from 5 February 2024 to 17 February 2024.
    """)

pop_info = html.Div([
        dbc.Button(
                html.I(className="fas fa-info-circle", style={'color': '#2fa4e7'}),
                id='info-data',
                color='fff',
                n_clicks=0),
            dbc.Popover(
                children=popover_content,
                target='info-data', 
                body=True, 
                style={'maxHeight': '80px'},
                trigger='hover'),
            ])

# Create navigation bar
nav = dbc.Nav(
    [
        dbc.NavLink("Overview", href=get_relative_path("/"), active="exact"),
        dbc.NavLink("Hourly Demand", href=get_relative_path("/hourly_demand"), active="exact"),
        dbc.NavLink("Weekly Demand", href=get_relative_path("/weekly_demand"), active="exact"),
        dbc.NavLink("Daily Demand", href=get_relative_path("/daily_demand"), active="exact"),
        dbc.NavLink("Temperature", href=get_relative_path("/temperature"), active="exact"),
        dbc.DropdownMenu(
            [dbc.DropdownMenuItem('Data Source', href='https://www.eia.gov/electricity/wholesalemarkets/index.php', target='_blank'),
             dbc.DropdownMenuItem('Plotly Library', href='https://plotly.com/python/', target='_blank'),
             dbc.DropdownMenuItem('Dash Library', href='https://dash.plotly.com/', target='_blank'),
             html.Hr(),
             dbc.DropdownMenuItem('Figure Friday', href='https://community.plotly.com/t/figure-friday-2024-week-49/89206', target='_blank')],        
        label="Sources",
        nav=True),
    ])


# Create app layout=================================================================
app.layout = dbc.Container([ 
    # Header  
    dbc.Row([
        dbc.Col([
            html.Div([html.H3('Electricity Demand in New England, US, for the Year 2024', style={'fontSize': '2rem'}), 
                      pop_info], className='d-flex align-items-center justify-content-start'),
            nav], width=9),
        dbc.Col(html.Img(src='assets/power_electric_tr.png', style={'height': '100px'}),
            width=3, className='d-flex align-items-center justify-content-end'),
    ], className='align-items-center  border-bottom border-primary mt-3 mb-4'), 
   
    # Page content  
    dash.page_container,
])


if __name__ == '__main__':
    app.run_server(debug=False)