Plotly mapbox layer not displaying image

šŸ“Š Plotly Python
1

Hello, I am trying to create a scatter mapbox using open-street-map as well as an image which I want to overlay as a layer when a user zooms into the map.

Currently my code looks like the following:

import pandas as pd
import plotly.express as px
import os

dir_path = os.path.dirname(os.path.realpath(__file__))

map_file = dir_path + "\\map.png"

df_event = pd.Dataframe()#dataframe containing long and lattitude coordinates

#Using plotly plot the clusters on the map and color the points based on the cluster they belong to
fig = px.scatter_mapbox(df_event, lat="Latitude", lon="Longitude", zoom=10)
fig.update_layout(mapbox_style="open-street-map",
                    mapbox_layers=[
                        {
                            "sourcetype": "image",
                            "source": "file://"+map_file,
                            "coordinates": [[10.0025794227684, 53.6280250042934] [10.0016447071323, 53.6280250042934] [10.0016447071323, 53.6281356890004] [10.0025794227684, 53.6281356890004]]
                        }
                    ])
fig.show()

The plot displays all the observations fine on the map. But the png file iā€™m trying to overlay does not appear on the map despite this.