Use Callback to dynamically set the marks of a rangeslider


Is it possible to use a callback to dynamically update marks for a rangeslider? So far, no luck with using a callback to return a dictionary.

app = dash.Dash()

app.layout= html.Div([html.Button('Test Slider',id='test'), dcc.RangeSlider(id='range_test')])


def test(clicks):
    if clicks == 1:
        return {1:'1',2:'2',3:'3'}

if __name__ == '__main__':

Thanks in advance for the help!


Did you try to provide min and max props to your dcc.RangeSlider component?


This sounds like a bug. It should work (i.e. it should be possible to update any property of any component through a callback). I made an issue here:


What version of dash-core-components are you using? That example is working for me with 0.28.0



The example broke when I used floating points instead of integers for the keys of the dictionary, e.g. {1.0: '1', ...}


Thanks so much for the fast response to this question. You guys are great. I have a couple of other things to work out but I think the float vs. integer is the issue. All of the other callbacks do seem to work.

Confirmed. The issue was that my marks were values generated from a dataframe using numpy.unique. The product of this was, of course, an array with dtype=float. .

Once changed to integers, this works perfectly. Thanks again for the fast and thorough follow-up.


Hi revisiting this … I can generate marks = {dictionary object} through the callback, but how does one set the min, max, allowCross=False etc. settings?

I tried returning {min=-5, max = 5, allowCross=False, {-5:‘5’, -2 : ‘-2’, 0 : ‘0’, 2 : ‘2’, 5 : ‘5’} }, but this did not work.