Unable to add background image to Plotly Express data visualization

I'm trying to use a background image in Plotly Express but it never seems to show up. I've tried various other options on StackOverflow but none have worked so far. Here's the code that I'm working with currently:

fig = px.scatter(df, x="X", y="Y", color="teamId", hover_name="NickName", animation_frame="GameTime", animation_group="NickName", range_x=[-4,110], range_y=[-4,72], size='size', size_max=8, width=900, height=700, color_discrete_map=color_discrete_map, title="Animated Match Recreation")

# Remove side scale and hide zero and gridlines
fig.update_layout(
    coloraxis_showscale=False,
    xaxis=dict(showgrid=False, zeroline=False),
    yaxis=dict(showgrid=False, zeroline=False),
)
# Disable axis ticks and labels
fig.update_xaxes(showticklabels=False)
fig.update_yaxes(showticklabels=False)
fig.update_xaxes(title_text='')
fig.update_yaxes(title_text='')

# Background image file
image_file = 'WhitePitch.png'
image_path = os.path.join(os.getcwd(),image_file)

fig.add_layout_image(
        dict(
            source=image_path,
            xref="x",
            yref="y",
            x=0,
            y=0,
            sizex=100,
            sizey=70,
            sizing="stretch",
            opacity=0.5,
            layer="below")
)

# Sets background to white vs grey
fig.update_layout(template="plotly_white")

app = dash.Dash()
app.layout = html.Div([
    dcc.Graph(figure=fig)
])

app.run_server(debug=True, use_reloader=False)

Any helpful hints would be much appreciated! Thanks.

Here is a picture of the result currently. I'm trying to add a football pitch as a background