Simple slider to bar chart

I built a bar chart with too many bars and I need a simple slider to show 10 bars for each slide position. Is it possible?

hi @pedromsouza

What do you mean a simple slider to show 10 bars for each slide position? Can you clarify please.

A slider button (horizontal) that will show 10 bars for each “step”. First 10 bars, move 1 step in slider, 10-20 bars, one more step, 20-30 bars and so on.

I’d like something like this

image

Could you work with something like this"

import plotly.express as px
data_canada = px.data.gapminder().query("country == 'Canada'")
fig = px.bar(data_canada, x='year', y='pop')
fig.update_layout(xaxis_rangeslider_visible=True)

fig.show()

Otherwise, I recommend you use the dcc.Slider in Dash and connect it to your bar chart. Here are a few examples:

(Make sure to choose the Slider components)

Hi Adam,

I tried adding fig.update_layout(xaxis_rangeslider_visible=True) but it didn’t do anything…

        fig = px.bar(filtered_df, x='competencia', y='quantidade',barmode='group', color_discrete_sequence=px.colors.sequential.Blugrn, title='Acervo por Competência (total: '+str('{:.0f}'.format(filtered_df['quantidade'].sum()))+')', labels={'ano':'Ano','quantidade':'Nº de Processos','sum of':'','competência':'Competência'}, text='quantidade')
        fig.update_xaxes(type='category')
        fig.update_yaxes(tickformat='.')
        fig.update_layout(yaxis_title="# Processos")
        fig.update_layout(legend_title_text='Competência')
        fig.update_layout(xaxis_rangeslider_visible=True)
        fig.update_layout(hoverlabel=dict(bgcolor="white", font_size=14))

@pedromsouza
can you share a reproducible example of your code and data. Something I can plug into my computer and run?

Thanks Adam, but I can’t. It’s sensitive data retrievied direclty using sql database.

I decided to show 15 bars using nlargest.

It would be great if the number of visible bars was a parameter in plotly bar chart. If the number of bars is bigger, it could automatically show a slider.