How do I add a background image with animation graph

📊 Plotly Python
1

Hi, I want to add a background image that is stored locally (jpg) to animation graph.
and the code uses plotly.express.

here is example code

import plotly.express as px
df = px.data.gapminder()
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])

2

@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")])

img-bcg
img-bcg700×450 36.1 KB

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

1 Like
3

hi
I really thank you for your help.

this “Plotly” is amazing

if I could go to see you, I’d treat you to a nice lunch for you

this is good for me :slight_smile:

have a nice day

2020년 3월 4일 (수) 오전 12:03, empet via Plotly Community Forum plot@discoursemail.com님이 작성:

1 Like
4

Is there anyway to add images and assign them to a category so when I draw a bar chart each bar representing a category has it’s own dedicated image?