How do I add a background image with animation graph

@Y.J

import plotly.express as px
df = px.data.gapminder()
fig=px.scatter(df, x="gdpPercap", y="lifeExp", animation_frame="year", animation_group="country",
size="pop", color="continent", hover_name="country",
log_x=True, size_max=55, range_x=[100,100000], range_y=[25,90])


import base64
#set a local image as a background
image_filename = 'first_plotly.png'
plotly_logo = base64.b64encode(open(image_filename, 'rb').read())

fig.update_layout(
                images= [dict(
                    source='data:image/png;base64,{}'.format(plotly_logo.decode()),
                    xref="paper", yref="paper",
                    x=0, y=1,
                    sizex=0.5, sizey=0.5,
                    xanchor="left",
                    yanchor="top",
                    #sizing="stretch",
                    layer="above")])

For more image settings see https://plot.ly/python/images/

1 Like