Black Lives Matter. Please consider donating to Black Girls Code today.

Setting the min and max of a rangeslider with a callback

Hi, I’m trying to create a dropdown menu which selects data from a pandas dataframe. A callback takes the value of the dropdown menu as an input and calculates the minimum and maximum points for a rangeslider. This should be passed as an output. I tried 2 different methods. First I tried to pass the ‘min’ and ‘max’ directly in the callback. However, these are python reserved keywords, so the code throws an error.

@app.callback(Output('slider-keeper', ['min','max','value']),[Input('select-assumption', 'value')])
def update_slider_example(input):   
min_value = min(df_data_FW[input])
max_value = min(df_data_FW[input])
return {min=min_value, max=max_valuem, value = [min_value,max_value]}

Next I tried to pass the range slider component to a html div.

@app.callback(Output('slider-keeper', 'children'),[Input('select-assumption', 'value')])
def update_slider_example(input):   
min_value = min(df_data_FW[input])
max_value = min(df_data_FW[input])
return dcc.RangeSlider(
    id='range-slider',
    min=min_value,
    max=max_value,
    value=[min_value, max_value],
)

The code runs, however the app seems to be stalled during updating. It should be noted that I have other components which depends on the value of the range slider. I hope you can help to come up with a solution to this problem. Thanks you in advance.

1 Like
@app.callback(Output('slider-keeper', 'min'),
              [Input('select-assumption', 'value')])
    def update_slider_example_min(input):   
        min_value = min(df_data_FW[input])
        return min_value

@app.callback(Output('slider-keeper', 'max'),
              [Input('select-assumption', 'value')])
    def update_slider_example_max(input):
        max_value = max(df_data_FW[input])
        return max_value

@app.callback(Output('slider-keeper', 'value'),
              [Input('select-keeper', 'min')
               Input('select-keeper', 'max')])
    def update_slider_example_value(min_value, max_value): 
        return [min_value, max_value]

Correct me if I am wrong, but I think Output can change only single value.

2 Likes

You’re absolutely right! I was just working on the same issue and have split my callbacks in the same way as you. However by doing this I ran into further issues with other of my components. So think I’ll have to abandon this for now. Thank you for your help.