Plotly：如何根据链接的下拉值自动更新 DatePickerRange 中的开始日期和结束日期？
Plotly: How to update the start date and end date in DatePickerRange automatically based on a chained dropdown value?
我想在输入为先前下拉列表值的回调中自动更新 DatePickerRange 的开始日期和结束日期。我有 2 个链接的下拉菜单，我正在做同样的事情来更新第二个相关下拉菜单的选项。我尝试对 datepickerRange 做同样的事情，但我似乎无法找到一种方法可以 return 来自 def 的开始日期和结束日期：
@app.callback(
Output(component_id='date_choice', component_property='start_date'),
Output(component_id='date_choice', component_property='end_date'),
Input(component_id='release_choice', component_property='value'))
def get_options(date_choice):
dff = df[df.date2 == date_choice]
return [{'label': i, 'value': i} for i in dff['date2']]
完整代码如下：
import dash
import datetime as datetime
import plotly.express as px
import pandas as pd
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Output, Input
df = pd.DataFrame({'Unnamed: 0': {0: 0, 1: 1, 2: 2, 3: 3, 4: 4, 5: 5, 6: 6, 7: 7, 8: 8, 9: 9, 10: 10, 11: 11, 12: 12, 13: 13},
'Technology': {0: '4G', 1: '4G', 2: 'SM', 3: '5G', 4: 'SM', 5: '4G', 6: 'SM', 7: '5G', 8: '2G', 9: 'SM', 10: '5G', 11: 'SM', 12: 'SM', 13: '4G'},
'SystemRelease': {0: 'lte22', 1: 'lte22', 2: 'umts22', 3: '5G22', 4: 'umts22A', 5: 'lte18A', 6: 'umts6A', 7: '5G22A', 8: '2G18', 9: 'L22B', 10: '5G22A', 11: 'umts22B', 12: 'L22A', 13: 'lte18A'},
'Date': {0: '27.09.2022', 1: '26.09.2022', 2: '25.09.2022', 3: '25.09.2022', 4: '24.09.2022', 5: '23.09.2022', 6: '23.09.2022', 7: '23.09.2022', 8: '20.09.2022', 9: '22.09.2022', 10: '22.09.2022', 11: '22.09.2022', 12: '22.09.2022', 13: '22.09.2022'},
'TypeofRelease': {0: 'Normal Update', 1: 'Standard Update', 2: 'Standard Update', 3: 'Maintenance Delivery', 4: 'Delivery', 5: 'Standard Update', 6: 'Normal Update', 7: 'Delivery', 8: 'Standard Update', 9: 'Delivery', 10: 'Delivery', 11: 'Delivery', 12: 'Delivery', 13: 'Standard Update'},
'Package': {0: '2.5', 1: '0.3', 2: '0.3', 3: '1.1.2', 4: '1.0', 5: '3.0.7', 6: '01.03.2007', 7: '0.2', 8: '2.3', 9: '1.0', 10: '0.5', 11: '1.0', 12: '1.0.6', 13: '6.0'}})
df['date2'] = [datetime.datetime.strptime(x, '%d.%m.%Y') for x in df['Date'] ]
df.sort_values(by=['date2'], inplace=True)
app = dash.Dash(__name__)
app.title = "Roadmap"
app.layout = html.Div(
children=[
html.Div(
children=[
html.Div(
children=[
html.Div(children='Select Technology:', className="menu-title"),
dcc.Dropdown(
id='Tech_choice',
options=[{'label': x, 'value': x}
for x in df.Technology.unique()],
value='4G',
clearable=False,
className="dropdown",
), ]),
html.Div(
children=[
html.Div(children="Select Release:", className="menu-title"),
dcc.Dropdown(
id='release_choice',
options=[],
clearable=False,
className="dropdown",
)
]
),
html.Div(
children=[
html.Div(children="Select Date:", className="menu-title"),
dcc.DatePickerRange(
id="date_choice",
min_date_allowed=df.date2.min().date(),
max_date_allowed=df.date2.max().date(),
start_date=df.date2.min().date(),
end_date=df.date2.max().date(),
)
]
),
],
className="menu",
),
html.Div(
children=[
html.Div(
children=dcc.Graph(
id='my-graph', config={"displayModeBar": False},
# style={'overflowY': 'scroll', 'width': 1000}
),
className="card",
),
],
className="wrapper",
), ])
@app.callback(
Output(component_id='release_choice', component_property='options'),
Input(component_id='Tech_choice', component_property='value'))
def get_options(Tech_choice):
dff = df[df.Technology == Tech_choice]
return [{'label': i, 'value': i} for i in dff['SystemRelease'].unique()]
@app.callback(
Output(component_id='release_choice', component_property='value'),
Input(component_id='release_choice', component_property='options'))
def get_values(release_choice):
return [k['value'] for k in release_choice][1]
@app.callback(
Output(component_id='date_choice', component_property='start_date'),
Output(component_id='date_choice', component_property='end_date'),
Input(component_id='release_choice', component_property='value'))
def get_options(date_choice):
dff = df[df.date2 == date_choice] # doubt
return [{'label': i, 'value': i} for i in dff['date2']]
@app.callback(Output(component_id='my-graph', component_property='figure'),
[Input(component_id='release_choice', component_property='value')],
[Input(component_id='Tech_choice', component_property='value')],
[Input(component_id='date_choice', component_property='start_date')],
[Input(component_id='date_choice', component_property='end_date')], )
def int_gr(release_choice, Tech_choice, start_date, end_date):
print(Tech_choice)
print(release_choice)
dff = df[(df['SystemRelease'] == release_choice) & (df['Technology'] == Tech_choice) & (df['date2'] >= start_date) & (df['date2'] <= end_date)]
fig = px.scatter(data_frame=dff, x='date2', y='SystemRelease', color="TypeofRelease", text='Package',
labels={
"SystemRelease": "System Release",
"date2": "Date",
"TypeofRelease": "Type of Release:"
})
fig.update_traces(marker=dict(size=12,
line=dict(width=2,
color='DarkSlateGrey')),
selector=dict(mode='markers'))
# fig.update_traces(boxpoints='all', jitter=0.8)
fig.update_traces(textposition='top center', mode='markers+text')
fig.update_layout(
autosize=False,
width=1200,
height=400)
return fig
if __name__ == '__main__':
app.run_server()
快速浏览一下数据：
这里发生了很多事情，我不能保证生成的应用程序会完全按照您的目标进行。但是您似乎在这里犯的唯一错误是：
The input argument Tech_choice.value must be a list or tuple of
dash.dependencies.Inputs.
这说明您的回调必须设置为：
@app.callback(
Output(component_id='release_choice', component_property='options'),
[Input(component_id='Tech_choice', component_property='value')])
而不是：
@app.callback(
Output(component_id='release_choice', component_property='options'),
Input(component_id='Tech_choice', component_property='value'))
前者用方括号 Input 括起来，因此是列表中的一个元素，而后者是您尝试过的。你正在做一些更深入的事情：
@app.callback(Output(component_id='my-graph', component_property='figure'),
[Input(component_id='release_choice', component_property='value')],
[Input(component_id='Tech_choice', component_property='value')],
[Input(component_id='date_choice', component_property='start_date')],
[Input(component_id='date_choice', component_property='end_date')], )
但在这里您将 Input 组件设置为 列表列表 而不仅仅是列表，所以那也会失败。这可能有点令人困惑，因为 Input 必须是列表的一个元素，而 Output 不是。但这仅适用于您的回调具有单个 Output 的情况。无论如何，如果你解决了这些问题。还要注意可能只出现在您的代码示例中而不是您正在使用的代码中的缩进错误，即这些：
fig.update_traces(marker=dict(size=12,
line=dict(width=2,
color='DarkSlateGrey')),
selector=dict(mode='markers'))
# fig.update_traces(boxpoints='all', jitter=0.8)
fig.update_traces(textposition='top center', mode='markers+text')
fig.update_layout(
autosize=False,
width=1200,
height=400)
return fig
然后您将得到这个看似有效的应用程序：
现在，我很难知道这是否完全符合您的目标，但请告诉我它对您的效果如何！
完整代码：
import dash
import datetime as datetime
import plotly.express as px
import pandas as pd
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Output, Input
df = pd.DataFrame({'Unnamed: 0': {0: 0, 1: 1, 2: 2, 3: 3, 4: 4, 5: 5, 6: 6, 7: 7, 8: 8, 9: 9, 10: 10, 11: 11, 12: 12, 13: 13},
'Technology': {0: '4G', 1: '4G', 2: 'SM', 3: '5G', 4: 'SM', 5: '4G', 6: 'SM', 7: '5G', 8: '2G', 9: 'SM', 10: '5G', 11: 'SM', 12: 'SM', 13: '4G'},
'SystemRelease': {0: 'lte22', 1: 'lte22', 2: 'umts22', 3: '5G22', 4: 'umts22A', 5: 'lte18A', 6: 'umts6A', 7: '5G22A', 8: '2G18', 9: 'L22B', 10: '5G22A', 11: 'umts22B', 12: 'L22A', 13: 'lte18A'},
'Date': {0: '27.09.2022', 1: '26.09.2022', 2: '25.09.2022', 3: '25.09.2022', 4: '24.09.2022', 5: '23.09.2022', 6: '23.09.2022', 7: '23.09.2022', 8: '20.09.2022', 9: '22.09.2022', 10: '22.09.2022', 11: '22.09.2022', 12: '22.09.2022', 13: '22.09.2022'},
'TypeofRelease': {0: 'Normal Update', 1: 'Standard Update', 2: 'Standard Update', 3: 'Maintenance Delivery', 4: 'Delivery', 5: 'Standard Update', 6: 'Normal Update', 7: 'Delivery', 8: 'Standard Update', 9: 'Delivery', 10: 'Delivery', 11: 'Delivery', 12: 'Delivery', 13: 'Standard Update'},
'Package': {0: '2.5', 1: '0.3', 2: '0.3', 3: '1.1.2', 4: '1.0', 5: '3.0.7', 6: '01.03.2007', 7: '0.2', 8: '2.3', 9: '1.0', 10: '0.5', 11: '1.0', 12: '1.0.6', 13: '6.0'}})
df['date2'] = [datetime.datetime.strptime(x, '%d.%m.%Y') for x in df['Date'] ]
df.sort_values(by=['date2'], inplace=True)
app = dash.Dash(__name__)
app.title = "Roadmap"
app.layout = html.Div(
children=[
html.Div(
children=[
html.Div(
children=[
html.Div(children='Select Technology:', className="menu-title"),
dcc.Dropdown(
id='Tech_choice',
options=[{'label': x, 'value': x}
for x in df.Technology.unique()],
value='4G',
clearable=False,
className="dropdown",
), ]),
html.Div(
children=[
html.Div(children="Select Release:", className="menu-title"),
dcc.Dropdown(
id='release_choice',
options=[],
clearable=False,
className="dropdown",
)
]
),
html.Div(
children=[
html.Div(children="Select Date:", className="menu-title"),
dcc.DatePickerRange(
id="date_choice",
min_date_allowed=df.date2.min().date(),
max_date_allowed=df.date2.max().date(),
start_date=df.date2.min().date(),
end_date=df.date2.max().date(),
)
]
),
],
className="menu",
),
html.Div(
children=[
html.Div(
children=dcc.Graph(
id='my-graph', config={"displayModeBar": False},
# style={'overflowY': 'scroll', 'width': 1000}
),
className="card",
),
],
className="wrapper",
), ])
@app.callback(
Output(component_id='release_choice', component_property='options'),
[Input(component_id='Tech_choice', component_property='value')])
def get_options(Tech_choice):
dff = df[df.Technology == Tech_choice]
return [{'label': i, 'value': i} for i in dff['SystemRelease'].unique()]
@app.callback(
Output(component_id='release_choice', component_property='value'),
[Input(component_id='release_choice', component_property='options')])
def get_values(release_choice):
return [k['value'] for k in release_choice][1]
@app.callback(
[Output(component_id='date_choice', component_property='start_date'),
Output(component_id='date_choice', component_property='end_date')],
[Input(component_id='release_choice', component_property='value')])
def get_options(date_choice):
dff = df[df.date2 == date_choice] # doubt
return [{'label': i, 'value': i} for i in dff['date2']]
@app.callback(Output(component_id='my-graph', component_property='figure'),
[Input(component_id='release_choice', component_property='value'),
Input(component_id='Tech_choice', component_property='value'),
Input(component_id='date_choice', component_property='start_date'),
Input(component_id='date_choice', component_property='end_date')], )
def int_gr(release_choice, Tech_choice, start_date, end_date):
print(Tech_choice)
print(release_choice)
dff = df[(df['SystemRelease'] == release_choice) & (df['Technology'] == Tech_choice) & (df['date2'] >= start_date) & (df['date2'] <= end_date)]
fig = px.scatter(data_frame=dff, x='date2', y='SystemRelease', color="TypeofRelease", text='Package',
labels={
"SystemRelease": "System Release",
"date2": "Date",
"TypeofRelease": "Type of Release:"
})
fig.update_traces(marker=dict(size=12,
line=dict(width=2,
color='DarkSlateGrey')),
selector=dict(mode='markers'))
# fig.update_traces(boxpoints='all', jitter=0.8)
fig.update_traces(textposition='top center', mode='markers+text')
fig.update_layout(
autosize=False,
width=1200,
height=400)
return fig
if __name__ == '__main__':
app.run_server()
我想在输入为先前下拉列表值的回调中自动更新 DatePickerRange 的开始日期和结束日期。我有 2 个链接的下拉菜单，我正在做同样的事情来更新第二个相关下拉菜单的选项。我尝试对 datepickerRange 做同样的事情，但我似乎无法找到一种方法可以 return 来自 def 的开始日期和结束日期：
@app.callback(
Output(component_id='date_choice', component_property='start_date'),
Output(component_id='date_choice', component_property='end_date'),
Input(component_id='release_choice', component_property='value'))
def get_options(date_choice):
dff = df[df.date2 == date_choice]
return [{'label': i, 'value': i} for i in dff['date2']]
完整代码如下：
import dash
import datetime as datetime
import plotly.express as px
import pandas as pd
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Output, Input
df = pd.DataFrame({'Unnamed: 0': {0: 0, 1: 1, 2: 2, 3: 3, 4: 4, 5: 5, 6: 6, 7: 7, 8: 8, 9: 9, 10: 10, 11: 11, 12: 12, 13: 13},
'Technology': {0: '4G', 1: '4G', 2: 'SM', 3: '5G', 4: 'SM', 5: '4G', 6: 'SM', 7: '5G', 8: '2G', 9: 'SM', 10: '5G', 11: 'SM', 12: 'SM', 13: '4G'},
'SystemRelease': {0: 'lte22', 1: 'lte22', 2: 'umts22', 3: '5G22', 4: 'umts22A', 5: 'lte18A', 6: 'umts6A', 7: '5G22A', 8: '2G18', 9: 'L22B', 10: '5G22A', 11: 'umts22B', 12: 'L22A', 13: 'lte18A'},
'Date': {0: '27.09.2022', 1: '26.09.2022', 2: '25.09.2022', 3: '25.09.2022', 4: '24.09.2022', 5: '23.09.2022', 6: '23.09.2022', 7: '23.09.2022', 8: '20.09.2022', 9: '22.09.2022', 10: '22.09.2022', 11: '22.09.2022', 12: '22.09.2022', 13: '22.09.2022'},
'TypeofRelease': {0: 'Normal Update', 1: 'Standard Update', 2: 'Standard Update', 3: 'Maintenance Delivery', 4: 'Delivery', 5: 'Standard Update', 6: 'Normal Update', 7: 'Delivery', 8: 'Standard Update', 9: 'Delivery', 10: 'Delivery', 11: 'Delivery', 12: 'Delivery', 13: 'Standard Update'},
'Package': {0: '2.5', 1: '0.3', 2: '0.3', 3: '1.1.2', 4: '1.0', 5: '3.0.7', 6: '01.03.2007', 7: '0.2', 8: '2.3', 9: '1.0', 10: '0.5', 11: '1.0', 12: '1.0.6', 13: '6.0'}})
df['date2'] = [datetime.datetime.strptime(x, '%d.%m.%Y') for x in df['Date'] ]
df.sort_values(by=['date2'], inplace=True)
app = dash.Dash(__name__)
app.title = "Roadmap"
app.layout = html.Div(
children=[
html.Div(
children=[
html.Div(
children=[
html.Div(children='Select Technology:', className="menu-title"),
dcc.Dropdown(
id='Tech_choice',
options=[{'label': x, 'value': x}
for x in df.Technology.unique()],
value='4G',
clearable=False,
className="dropdown",
), ]),
html.Div(
children=[
html.Div(children="Select Release:", className="menu-title"),
dcc.Dropdown(
id='release_choice',
options=[],
clearable=False,
className="dropdown",
)
]
),
html.Div(
children=[
html.Div(children="Select Date:", className="menu-title"),
dcc.DatePickerRange(
id="date_choice",
min_date_allowed=df.date2.min().date(),
max_date_allowed=df.date2.max().date(),
start_date=df.date2.min().date(),
end_date=df.date2.max().date(),
)
]
),
],
className="menu",
),
html.Div(
children=[
html.Div(
children=dcc.Graph(
id='my-graph', config={"displayModeBar": False},
# style={'overflowY': 'scroll', 'width': 1000}
),
className="card",
),
],
className="wrapper",
), ])
@app.callback(
Output(component_id='release_choice', component_property='options'),
Input(component_id='Tech_choice', component_property='value'))
def get_options(Tech_choice):
dff = df[df.Technology == Tech_choice]
return [{'label': i, 'value': i} for i in dff['SystemRelease'].unique()]
@app.callback(
Output(component_id='release_choice', component_property='value'),
Input(component_id='release_choice', component_property='options'))
def get_values(release_choice):
return [k['value'] for k in release_choice][1]
@app.callback(
Output(component_id='date_choice', component_property='start_date'),
Output(component_id='date_choice', component_property='end_date'),
Input(component_id='release_choice', component_property='value'))
def get_options(date_choice):
dff = df[df.date2 == date_choice] # doubt
return [{'label': i, 'value': i} for i in dff['date2']]
@app.callback(Output(component_id='my-graph', component_property='figure'),
[Input(component_id='release_choice', component_property='value')],
[Input(component_id='Tech_choice', component_property='value')],
[Input(component_id='date_choice', component_property='start_date')],
[Input(component_id='date_choice', component_property='end_date')], )
def int_gr(release_choice, Tech_choice, start_date, end_date):
print(Tech_choice)
print(release_choice)
dff = df[(df['SystemRelease'] == release_choice) & (df['Technology'] == Tech_choice) & (df['date2'] >= start_date) & (df['date2'] <= end_date)]
fig = px.scatter(data_frame=dff, x='date2', y='SystemRelease', color="TypeofRelease", text='Package',
labels={
"SystemRelease": "System Release",
"date2": "Date",
"TypeofRelease": "Type of Release:"
})
fig.update_traces(marker=dict(size=12,
line=dict(width=2,
color='DarkSlateGrey')),
selector=dict(mode='markers'))
# fig.update_traces(boxpoints='all', jitter=0.8)
fig.update_traces(textposition='top center', mode='markers+text')
fig.update_layout(
autosize=False,
width=1200,
height=400)
return fig
if __name__ == '__main__':
app.run_server()
快速浏览一下数据：
这里发生了很多事情，我不能保证生成的应用程序会完全按照您的目标进行。但是您似乎在这里犯的唯一错误是：
The input argument
Tech_choice.valuemust be a list or tuple ofdash.dependencies.Inputs.
这说明您的回调必须设置为：
@app.callback(
Output(component_id='release_choice', component_property='options'),
[Input(component_id='Tech_choice', component_property='value')])
而不是：
@app.callback(
Output(component_id='release_choice', component_property='options'),
Input(component_id='Tech_choice', component_property='value'))
前者用方括号 Input 括起来，因此是列表中的一个元素，而后者是您尝试过的。你正在做一些更深入的事情：
@app.callback(Output(component_id='my-graph', component_property='figure'),
[Input(component_id='release_choice', component_property='value')],
[Input(component_id='Tech_choice', component_property='value')],
[Input(component_id='date_choice', component_property='start_date')],
[Input(component_id='date_choice', component_property='end_date')], )
但在这里您将 Input 组件设置为 列表列表 而不仅仅是列表，所以那也会失败。这可能有点令人困惑，因为 Input 必须是列表的一个元素，而 Output 不是。但这仅适用于您的回调具有单个 Output 的情况。无论如何，如果你解决了这些问题。还要注意可能只出现在您的代码示例中而不是您正在使用的代码中的缩进错误，即这些：
fig.update_traces(marker=dict(size=12,
line=dict(width=2,
color='DarkSlateGrey')),
selector=dict(mode='markers'))
# fig.update_traces(boxpoints='all', jitter=0.8)
fig.update_traces(textposition='top center', mode='markers+text')
fig.update_layout(
autosize=False,
width=1200,
height=400)
return fig
然后您将得到这个看似有效的应用程序：
现在，我很难知道这是否完全符合您的目标，但请告诉我它对您的效果如何！
完整代码：
import dash
import datetime as datetime
import plotly.express as px
import pandas as pd
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Output, Input
df = pd.DataFrame({'Unnamed: 0': {0: 0, 1: 1, 2: 2, 3: 3, 4: 4, 5: 5, 6: 6, 7: 7, 8: 8, 9: 9, 10: 10, 11: 11, 12: 12, 13: 13},
'Technology': {0: '4G', 1: '4G', 2: 'SM', 3: '5G', 4: 'SM', 5: '4G', 6: 'SM', 7: '5G', 8: '2G', 9: 'SM', 10: '5G', 11: 'SM', 12: 'SM', 13: '4G'},
'SystemRelease': {0: 'lte22', 1: 'lte22', 2: 'umts22', 3: '5G22', 4: 'umts22A', 5: 'lte18A', 6: 'umts6A', 7: '5G22A', 8: '2G18', 9: 'L22B', 10: '5G22A', 11: 'umts22B', 12: 'L22A', 13: 'lte18A'},
'Date': {0: '27.09.2022', 1: '26.09.2022', 2: '25.09.2022', 3: '25.09.2022', 4: '24.09.2022', 5: '23.09.2022', 6: '23.09.2022', 7: '23.09.2022', 8: '20.09.2022', 9: '22.09.2022', 10: '22.09.2022', 11: '22.09.2022', 12: '22.09.2022', 13: '22.09.2022'},
'TypeofRelease': {0: 'Normal Update', 1: 'Standard Update', 2: 'Standard Update', 3: 'Maintenance Delivery', 4: 'Delivery', 5: 'Standard Update', 6: 'Normal Update', 7: 'Delivery', 8: 'Standard Update', 9: 'Delivery', 10: 'Delivery', 11: 'Delivery', 12: 'Delivery', 13: 'Standard Update'},
'Package': {0: '2.5', 1: '0.3', 2: '0.3', 3: '1.1.2', 4: '1.0', 5: '3.0.7', 6: '01.03.2007', 7: '0.2', 8: '2.3', 9: '1.0', 10: '0.5', 11: '1.0', 12: '1.0.6', 13: '6.0'}})
df['date2'] = [datetime.datetime.strptime(x, '%d.%m.%Y') for x in df['Date'] ]
df.sort_values(by=['date2'], inplace=True)
app = dash.Dash(__name__)
app.title = "Roadmap"
app.layout = html.Div(
children=[
html.Div(
children=[
html.Div(
children=[
html.Div(children='Select Technology:', className="menu-title"),
dcc.Dropdown(
id='Tech_choice',
options=[{'label': x, 'value': x}
for x in df.Technology.unique()],
value='4G',
clearable=False,
className="dropdown",
), ]),
html.Div(
children=[
html.Div(children="Select Release:", className="menu-title"),
dcc.Dropdown(
id='release_choice',
options=[],
clearable=False,
className="dropdown",
)
]
),
html.Div(
children=[
html.Div(children="Select Date:", className="menu-title"),
dcc.DatePickerRange(
id="date_choice",
min_date_allowed=df.date2.min().date(),
max_date_allowed=df.date2.max().date(),
start_date=df.date2.min().date(),
end_date=df.date2.max().date(),
)
]
),
],
className="menu",
),
html.Div(
children=[
html.Div(
children=dcc.Graph(
id='my-graph', config={"displayModeBar": False},
# style={'overflowY': 'scroll', 'width': 1000}
),
className="card",
),
],
className="wrapper",
), ])
@app.callback(
Output(component_id='release_choice', component_property='options'),
[Input(component_id='Tech_choice', component_property='value')])
def get_options(Tech_choice):
dff = df[df.Technology == Tech_choice]
return [{'label': i, 'value': i} for i in dff['SystemRelease'].unique()]
@app.callback(
Output(component_id='release_choice', component_property='value'),
[Input(component_id='release_choice', component_property='options')])
def get_values(release_choice):
return [k['value'] for k in release_choice][1]
@app.callback(
[Output(component_id='date_choice', component_property='start_date'),
Output(component_id='date_choice', component_property='end_date')],
[Input(component_id='release_choice', component_property='value')])
def get_options(date_choice):
dff = df[df.date2 == date_choice] # doubt
return [{'label': i, 'value': i} for i in dff['date2']]
@app.callback(Output(component_id='my-graph', component_property='figure'),
[Input(component_id='release_choice', component_property='value'),
Input(component_id='Tech_choice', component_property='value'),
Input(component_id='date_choice', component_property='start_date'),
Input(component_id='date_choice', component_property='end_date')], )
def int_gr(release_choice, Tech_choice, start_date, end_date):
print(Tech_choice)
print(release_choice)
dff = df[(df['SystemRelease'] == release_choice) & (df['Technology'] == Tech_choice) & (df['date2'] >= start_date) & (df['date2'] <= end_date)]
fig = px.scatter(data_frame=dff, x='date2', y='SystemRelease', color="TypeofRelease", text='Package',
labels={
"SystemRelease": "System Release",
"date2": "Date",
"TypeofRelease": "Type of Release:"
})
fig.update_traces(marker=dict(size=12,
line=dict(width=2,
color='DarkSlateGrey')),
selector=dict(mode='markers'))
# fig.update_traces(boxpoints='all', jitter=0.8)
fig.update_traces(textposition='top center', mode='markers+text')
fig.update_layout(
autosize=False,
width=1200,
height=400)
return fig
if __name__ == '__main__':
app.run_server()