OiO.lk Community platform!

Oio.lk is an excellent forum for developers, providing a wide range of resources, discussions, and support for those in the developer community. Join oio.lk today to connect with like-minded professionals, share insights, and stay updated on the latest trends and technologies in the development field.
  You need to log in or register to access the solved answers to this problem.
  • You have reached the maximum number of guest views allowed
  • Please register below to remove this limitation

Why not showing any figure for datepicker range?

  • Thread starter Thread starter user19791361
  • Start date Start date
U

user19791361

Guest
Can anyone help me to solve this problem? I'm trying to make a date picker range using Dash in Jupyter Notebook, but no figure appears as below. Can anyone correct my code if there's a mistake? Please enlighten me. no figure appears

i'm using this dataset dataset

here's my code look like

Code:
collisions = (
    pd.read_csv("NYC_Collisions.csv")
    .astype({"ACCIDENT_DATE": "datetime64[ns]"})
    .loc[:,["ACCIDENT_DATE", "BOROUGH", "COLLISION_ID"]]
    .groupby(["ACCIDENT_DATE", "BOROUGH"], as_index=False)
    .count()
    .rename(columns={
        "COLLISION_ID":"COLLISIONS", 
        "ACCIDENT_DATE":"DATE"})  
)

collisions.head()

from datetime import datetime
from datetime import date

app = Dash(__name__)


app.layout = html.Div([
    dcc.DatePickerRange(
        id="date picker",
        min_date_allowed=collisions["DATE"].min(),
        max_date_allowed=collisions["DATE"].max(),
        initial_visible_month=collisions["DATE"].max(),
        start_date=collisions["DATE"].min(),
        end_date=date(2022,1,1),
    ),
    dcc.Graph(id="graph")
])

@app.callback(Output("graph", "figure"),
              [Input("date picker", "start_date"),
               Input("date picker", "end_date"),])
def plot_collisions_bar(start_date, end_date):
    fig = px.bar(
        (collisions
         .loc[collisions["DATE"].between(start_date, end_date)]
         .groupby("BOROUGH", as_index=False)
         .sum()
        )
        ,
        x="COLLISIONS",
        y="BOROUGH",
        title=f"Traffic Accidents in NYC between {start_date[:10]} and {end_date[:10]}"
    )
    return fig

if __name__ == "__main__":
    app.run_server(mode="inline", port=8001, width="60%")
<p>Can anyone help me to solve this problem? I'm trying to make a date picker range using Dash in Jupyter Notebook, but no figure appears as below. Can anyone correct my code if there's a mistake? Please enlighten me. <a href="https://i.sstatic.net/cwZFSsrg.png" rel="nofollow noreferrer"><img src="https://i.sstatic.net/cwZFSsrg.png" alt="no figure appears" /></a></p>
<p><strong>i'm using this dataset</strong>
<a href="https://drive.google.com/file/d/1OnPxfCE1bKD7V_aB6Lf1OUMdFd0iVUwb/view?usp=sharing" rel="nofollow noreferrer">dataset</a></p>
<p><strong>here's my code look like</strong></p>
<pre><code>collisions = (
pd.read_csv("NYC_Collisions.csv")
.astype({"ACCIDENT_DATE": "datetime64[ns]"})
.loc[:,["ACCIDENT_DATE", "BOROUGH", "COLLISION_ID"]]
.groupby(["ACCIDENT_DATE", "BOROUGH"], as_index=False)
.count()
.rename(columns={
"COLLISION_ID":"COLLISIONS",
"ACCIDENT_DATE":"DATE"})
)

collisions.head()

from datetime import datetime
from datetime import date

app = Dash(__name__)


app.layout = html.Div([
dcc.DatePickerRange(
id="date picker",
min_date_allowed=collisions["DATE"].min(),
max_date_allowed=collisions["DATE"].max(),
initial_visible_month=collisions["DATE"].max(),
start_date=collisions["DATE"].min(),
end_date=date(2022,1,1),
),
dcc.Graph(id="graph")
])

@app.callback(Output("graph", "figure"),
[Input("date picker", "start_date"),
Input("date picker", "end_date"),])
def plot_collisions_bar(start_date, end_date):
fig = px.bar(
(collisions
.loc[collisions["DATE"].between(start_date, end_date)]
.groupby("BOROUGH", as_index=False)
.sum()
)
,
x="COLLISIONS",
y="BOROUGH",
title=f"Traffic Accidents in NYC between {start_date[:10]} and {end_date[:10]}"
)
return fig

if __name__ == "__main__":
app.run_server(mode="inline", port=8001, width="60%")
</code></pre>
 

Latest posts

A
Replies
0
Views
1
AgencyAnalytics
A
S
Replies
0
Views
1
Stacker Media
S
C
Replies
0
Views
1
CC.Talent
C
Top