2017-10-02 9 views
0

대시가있는이 Plotly example을 다시 만들려고하는데 버튼과 범위 슬라이더를 얻을 수 없습니다. 아무도 내가 이것을 어떻게 할 수 있는지 안다? 내가 어떻게했는지범위 슬라이더 및 선택기 (플롯 대시 포함)

Thas't :

traces =[{ 

     'x':df.index, 

     'y':df.level, 

     'type': 'scatter', 'mode': 'lines', 
     'name': 'a_level' 
    }] 
    graphs.append(dcc.Graph(
     id='a_level', 
     figure={ 
      'data': traces, 
      'layout': { 
        'type': 'date', 
        'rangeslider': {'visible':True}, 
        'margin': {'b': 0, 'r': 10, 'l': 60, 't': 0} 
      } 
     } 
    ) 
+0

질문에 사용하는 코드를 추가하십시오. URL의 코드가 변경 될 수 있습니다. –

+0

코드를 볼 수있는 링크를 클릭하면 Plotly 웹 사이트 (Range Slider 및 Selector in Python)의 예입니다. 나는 sth를 만들려고 노력하고있다. 대쉬와 같은 거. – Ali

+0

코드가 작동하지 않으면 올바른 해결책을 추측 할 수 없습니다. –

답변

2

RangeSlider는 (또한 대시 핵심 부품이다) Graph의 속성이 아니다하는 Dash Core Component입니다.

import dash_core_components as dcc 

app.layout = html.Div(children=[ 
    html.H1('My Dash App'), 
    html.Div(
     [ 
      html.Label('From 2007 to 2017', id='time-range-label'), 
      dcc.RangeSlider(
       id='year_slider', 
       min=1991, 
       max=2017, 
       value=[2007, 2017] 
      ), 
     ], 
     style={'margin-top': '20'} 
    ), 
    html.Hr(), 
    dcc.Graph(id='my-graph') 
]) 

지금 당신은 단지마다에게 RangeSlider 변경의 값을 호출되는 콜백을 정의 할 필요가 : 여기

는 간단한 응용 프로그램 레이아웃입니다. 이것은 _update_graph이 호출되는 Input입니다. 여러 입력을 가질 수 있습니다 (예 : Dropdown, RangeSlider 등).

Output은 항상 하나입니다. 이 예에서는 Graph 구성 요소의 속성이 figure입니다.

# the value of RangeSlider causes Graph to update 
@app.callback(
    output=Output('my-graph', 'figure'), 
    inputs=[Input('year_slider', 'value')] 
    ) 
def _update_graph(year_range): 
    date_start = '{}-01-01'.format(year_range[0]) 
    date_end = '{}-12-31'.format(year_range[1]) 
    # etc... 

Dash Core 구성 요소로 인해 여러 구성 요소가 업데이트 될 수 있습니다. 예를 들어 RangeSlider을 입력하면 Label이 변경 될 수 있습니다.

# the value of RangeSlider causes Label to update 
@app.callback(
    output=Output('time-range-label', 'children'), 
    inputs=[Input('year_slider', 'value')] 
    ) 
def _update_time_range_label(year_range): 
    return 'From {} to {}'.format(year_range[0], year_range[1]) 
+0

두 날짜 사이의 모든 요일을 나타 내기 위해'rangeslider' 객체가 어떻게 바뀔까요? 범위 슬라이더가'datetime' 객체를 받아 들일 수 있는지 확신하지 못합니까? 내가 설정 한 : 'date_range = pd.date_range (시작 = '1989-5-1', 끝 = '1989-9-30', freq = 'D')' 과 'dcc.RangeSlider (id = 'DateTimeSlider' 의 UpdateMode = '와 mouseUp' date_range.min 분 =(), 최대 = date_range.max() = 'D' 단계 값 = [date_range.min() date_range.max ()], )' – Andreuccio