Ctrl+K

dcc.RangeSlider

dcc.RangeSlider#

参考：dcc.RangeSlider | Dash for Python Documentation | Plotly

dcc.RangeSlider 简单例子#

一个绑定回调的基本 RangeSlider 的例子。

from dash import dcc, html
from dash.dependencies import Input, Output
from app import app
import dash
dash.register_page(__name__)

layout = html.Div([
    dcc.RangeSlider(
        id='my-range-slider',
        min=0,
        max=20,
        step=0.5,
        value=[5, 15]
    ),
    html.Div(id='output-container-range-slider')
])


@app.callback(
    Output('output-container-range-slider', 'children'),
    [Input('my-range-slider', 'value')])
def update_output(value):
    return f'你选择了 "{value}"'

标记和步长#

如果滑块 marks 被定义并且 step 被设置为 None，那么滑块将只能选择标记预定义的值。注意，默认值是 step=1，因此必须显式指定 None 以获得此行为。

from dash import dcc
import dash
dash.register_page(__name__)
layout = dcc.RangeSlider(
    min=0,
    max=10,
    step=None,
    marks={
        0: '0 °F',
        3: '3 °F',
        5: '5 °F',
        7.65: '7.65 °F',
        10: '10 °F'
    },
    value=[3, 7.65]
)

待续。。。

目录