I’m really interested in this kind of functionality and how to implement.
I have a whole bunch of calculations that depend off the values of the slider but at the same time I want to continually update the values displayed so the user knows where they are sliding.
The most efficient way is to run the calculations on ‘mouseup’ but then I loose the beauty of my sliders values being continually updated
How could I extend this sample application to store the final values after mouseup and run some calculations whilst continually updating on values displayed
import dash
from dash.dependencies import Input, Output
import dash_core_components as dcc
import dash_html_components as html
from components import Column, Header, Row
import pandas as pd
from pandas.tseries.offsets import *
df = pd.read_csv('https://vincentarelbundock.github.io/Rdatasets/csv/boot/acme.csv')
df['month'] = pd.to_datetime(df['month'])
def _create_year_slider(datelist):
dlist = pd.DatetimeIndex(datelist).normalize()
tags = {}
x = 0
for i in dlist.unique():
tags[x] = (i+pd.tseries.offsets.DateOffset(months=1)).strftime('%b-%Y')
x = x+1
return tags
my_dates_list = _create_year_slider(df['month'])
app = dash.Dash(
__name__
)
server = app.server
# Standard Dash app code below
app.layout = html.Div(className='container', children=[
Row([
Column(width=4, children=[
html.Div(id='updatemode-output-container', style={'margin-top': 20})
]),
]),
Row([
dcc.RangeSlider(
id='year-slider',
updatemode='drag',
min=0,
max=max(my_dates_list),
value=[0, max(my_dates_list)],
),
])
])
@app.callback(Output('updatemode-output-container', 'children'),
[Input('year-slider', 'value')])
def display_value(value):
return '{0} to {1}'.format(my_dates_list[value[0]], my_dates_list[value[1]])
if __name__ == '__main__':
app.run_server(debug=True)