How to only show top 10 in animated bar plot?

for example, in this video

I am trying to make bar plot like this, but I am having trouble with only showing the top ones, right now I can’t find a way to hide those are at the bottom, so everything has to be shown right now. So unless I make the barplot really really big, the bars and variable names are already misaligned like this:

at the top there are 5 bars but only 2 states, actually there are 5 states, and can be seen only if i set font size really small:

I have tried bargap,width, formatting axis in diff ways and has no luck.
Are there any possible ways to doing this?

Hi @charlie66, if you only want 5 bars to be displayed, you can take advantage of the fact that a categorical axis is mapped to numerical values. and limit the range of the axis like in the example below

import plotly.express as px
df = px.data.gapminder().query("year == 2007").query("continent == 'Europe'")
fig = px.bar(df, y='country', x='lifeExp', orientation='h')
fig.update_yaxes(range=(-.5, 6.5))
fig.show()

Hi Emmanuelle, your solution worked, thank you so much!

But I have some other problems now,

(1) As you can see the text on the bar are rotated, this only happens when the number is single digit, as soon as i gets to >10 it becomes normal.

(2) fig.update_traces(textposition=‘outside’) is not working, the text still shows up inside the bar

(3) I get numbers ‘raining’ from top left to bottom, I think those numbers are ‘text’ for other bars but how do I make them disappear?