Quantcast
Channel: 🎛️ Dash - Plotly Community Forum
Viewing all articles
Browse latest Browse all 6271

RangeSlider overcrowded marks values

$
0
0

I am implementing RangeSlider and the values is huge list of years. I am able to input the values but the same when I display through marks it overlaps (see below image).
This is the code I am using.

year_list = sorted(car_accidents.Year.tolist())
external_stylesheets = ['https://codepen.io/chriddyp/pen/bWLwgP.css']
app = dash.Dash(__name__, external_stylesheets=external_stylesheets)

app.layout = html.Div([
          html.Label('Select Years'),
#           dcc.RangeSlider(id='year-range-slider', min=1, max=10,step=1, value=[1,5], marks={i: i for i in range(10)})
#         dcc.RangeSlider(id='year-range-slider',     value=df_wimbledons.Year, )
        dcc.RangeSlider(
        id='year-slider',
        min = min(year_list),
        max = max(year_list),
        value=[1917, 2017],
        marks={i: {'labels':i,'style':{'writing-mode':'vertical-rl', 'text-orientation':'mixed'}} for i in year_list},
        step=5
    )

]
)

For the above code it does not display marks at all.

Where as when I replace the marks value with just marks={i: i for i in year_list}, below sort of overlapping happens

2 posts - 2 participants

Read full topic


Viewing all articles
Browse latest Browse all 6271

Trending Articles