How can I combine Choropleth and Scatter layer with animation frame in a plotly map

📊 Plotly Python
1

I combine Choropleth and Scatter map but the animation frame does not synchronize the data.
The animation frame on the Year only works with the scatter but does not change the data on the choropleth

fig = px.scatter_geo(dataset, locations="iso_alpha",
                    hover_name="Country", text = "Country",size="Value_Air",
                     animation_frame="Year", animation_group="Country",
                    )

fig_px = px.choropleth(dataset,    
                       locations = "iso_alpha",
                       color="Value_Co2", 
                       hover_name="Country", 
                       animation_frame="Year",
                       #animation_group="Country",
                       hover_data={'iso_alpha':False, 
                                  })

fig.add_trace(
    fig_px.data[0]
)
fig.show()

newplot
newplot700×450 45.8 KB
.

The animation frame on the date change only the scatter but not change the country background.
how should i do? can anyone help?

2 Likes
2

Hi @kikkaf welcome to the forum! Animation frames are stored in fig.frames and not in fig.data, and you need to merge the frames of the two figures as in the code below (in addition to adding the trace). Please read the tutorial on animations and the brand new tutorial on the structure of figures. Also if you do print(fig) you can inspect the structure of your figure and see that the figure has frames.

import plotly.express as px

df = px.data.gapminder()
fig = px.choropleth(df, locations="iso_alpha",
                    color="lifeExp", # lifeExp is a column of gapminder
                    hover_name="country", # column to add to hover information
                    color_continuous_scale=px.colors.sequential.Plasma,
                    animation_frame='year')
fig2 = px.scatter_geo(df, locations="iso_alpha",
                    size="lifeExp", # lifeExp is a column of gapminder
                    hover_name="country", # column to add to hover information
                    color_continuous_scale=px.colors.sequential.Plasma,
                    animation_frame='year')
fig.add_trace(fig2.data[0])
for i, frame in enumerate(fig.frames):
    fig.frames[i].data += (fig2.frames[i].data[0],)
fig.show()
3 Likes
3

It works, thanks for your help

4 
fig_px = px.choropleth(dataset,    
                       locations = "iso_alpha",
                       color="Value_Co2", 
                       hover_name="Country",
                       color_continuous_scale='Reds',
                       animation_frame="Year",
                       hover_data={'iso_alpha':False, 
                                  })

I have a similar problem with color_continuous_scale in choropleth graph,
When I combine the two graphs, it puts me the default color and not ‘Reds’.
Do you have any suggestions?

5

It’s because the colorscale is defined in the coloraxis, which itself is part of the layout of the figure, so you need to take the coloraxis and add it to the layout of the other figure. For such a case I would recommend to do a print(fig) in order to understand well the structure of the two figures, and take everything you need from the second figure to put it in the first one.

2 Likes
6

sorry, how do I click on a scatter and open another chart under the map, with country as a parameter?

newplot (3)
newplot (3)700×450 47.4 KB

7

How can I name the trace since fig.add_trace(fig2.data[0], name=“Trace 1” ) does not work. It results in an error: 'TypeError: add_trace() got an unexpected keyword argument ‘name’

Also, even the default trace name doesn’t initially show up on the Legend. But, eventually, it does. Here is a link showing the problem:

https://drive.google.com/file/d/1D4-YdC6n_E0_Oe21X5iknrqwrPNFYeTt/view?usp=sharing

Thanks!

8

Done exactly that but this error appears:
IndexError: tuple index out of range

Code:

fig = px.choropleth(df_grouped2, geojson=Colombia, locations='departamento', color=violence_severity,
                           color_continuous_scale="Viridis",
                           featureidkey="properties.DPTO_CNMBR",
                           animation_frame='año',
                           range_color=[0, df_grouped2[violence_severity].max()],
                           hover_data=['departamento', 'año', violence_severity],
                           center={"lat": 4.5, "lon": -73.5},
                           width=465,
                           height=440,
)                          

fig.update_geos(
    resolution=50,
    showcoastlines=True, coastlinecolor="RebeccaPurple",
    showland=True, landcolor="DarkGrey",
    showocean=True, oceancolor="LightGrey",
    showcountries=True, countrycolor="LightGrey",
    visible=False,fitbounds=False,
    lataxis_range=[-9,7], lonaxis_range=[-79,-68]
)
fig.update_layout(margin={"r":0,"t":0,"l":0,"b":0,'pad':0},coloraxis_showscale=True)

fig2 = px.scatter_geo(df_temp_grouped,geojson=Colombia_municipios, locations='municipio',
                        featureidkey="properties.MPIO_CNMBR",
                        color_continuous_scale="Viridis",
                        animation_frame='año',                 
                        hover_data=['departamento', 'año', violence_severity],
                        center={"lat": 4.5, "lon": -73.5},
                        width=465,height=440,
                        size=violence_severity

)
fig2.update_geos(
    resolution=50,
    showcoastlines=True, coastlinecolor="RebeccaPurple",
    showland=True, landcolor="DarkGrey",
    showocean=True, oceancolor="LightGrey",
    showcountries=True, countrycolor="LightGrey",
    visible=False,fitbounds=False,
    lataxis_range=[-9,7], lonaxis_range=[-79,-68]
)

fig.add_trace(fig2.data[0])
for i, frame in enumerate(fig.frames):
    fig.frames[i].data += (fig2.frames[i].data[0],)


fig.show()
9

image
image963×254 26.3 KB

I get this error, this is my code:


fig = px.choropleth(df_grouped2, geojson=Colombia, locations='departamento', color=violence_severity,
                           color_continuous_scale="Viridis",
                           featureidkey="properties.DPTO_CNMBR",
                           animation_frame='año',
                           range_color=[0, df_grouped2[violence_severity].max()],
                           hover_data=['departamento', 'año', violence_severity],
                           center={"lat": 4.5, "lon": -73.5},
                           width=465,
                           height=440,
)                          

fig.update_geos(
    resolution=50,
    showcoastlines=True, coastlinecolor="RebeccaPurple",
    showland=True, landcolor="DarkGrey",
    showocean=True, oceancolor="LightGrey",
    showcountries=True, countrycolor="LightGrey",
    visible=False,fitbounds=False,
    lataxis_range=[-9,7], lonaxis_range=[-79,-68]
)
fig.update_layout(margin={"r":0,"t":0,"l":0,"b":0,'pad':0},coloraxis_showscale=True)

fig2 = px.scatter_geo(df_temp_grouped,geojson=Colombia_municipios, locations='municipio',
                        featureidkey="properties.MPIO_CNMBR",
                        color_continuous_scale="Viridis",
                        animation_frame='año',                 
                        hover_data=['departamento', 'año', violence_severity],
                        center={"lat": 4.5, "lon": -73.5},
                        width=465,height=440,
                        size=violence_severity

)
fig2.update_geos(
    resolution=50,
    showcoastlines=True, coastlinecolor="RebeccaPurple",
    showland=True, landcolor="DarkGrey",
    showocean=True, oceancolor="LightGrey",
    showcountries=True, countrycolor="LightGrey",
    visible=False,fitbounds=False,
    lataxis_range=[-9,7], lonaxis_range=[-79,-68]
)

fig.add_trace(fig2.data[0])
for i, frame in enumerate(fig.frames):
    fig.frames[i].data += (fig2.frames[i].data[0],)


fig.show()