✊🏿 Black Lives Matter. Please consider donating to Black Girls Code today.
⚡️ Concerned about the grid? Kyle Baranko teaches how to predicting peak loads using XGBoost. Register for the August webinar!

How to specify range of x axis (zoom) if it's categories of numeric strings sorted by total descending?

I have a stacked bar graph where x axis is Departments as categories, there’s about a hundred departments, ordered by total descending, and I want to show the graph zoomed initially on the top 10. Without trying to zoom it looks good, longest stack bars to the left and decreasing in size along the x axis.

So I guessed I’d write this:
figure.update_xaxes(type='category', categoryorder='total descending', range=[0, 10])

From the reference sheet I understand that each category was given a number ascending from 0. But I get problems I can’t put my finger on.

  1. Setting that range=[0,10] seems to have taken the Department named ‘0’ as the first on the axis (it’s not the top department though). I made sure the column isn’t an int with df.astype({‘Department’: object}) but it doesn’t seem to help.

  2. range=[0,10] messes with the order, it looks like total ascending now.

  3. There are way more than 10 departments shown on the x axes. Maybe it has taken categories index 0 to index 10 and shows all of them in-between?

I’m sure it sounds like a complicated issue to wrap your mind around but perhaps someone experienced the same issues and would recognize it? Thanks in advance!

Here’s the figure I try to update:

df = df.groupby(['Department','MeanOfTransport'], as_index=False).sum()
df = df.astype({'Department': object})

figure = px.bar(
        data_frame=df,
        x='Department',
        y='Co2',
        color='MeanOfTransport',
        barmode='stack',
        text='Co2'
    )