Load datasource in Bokeh chart after a button click - button

Question

I am building a chart using Bokeh. I need to create an empty Figure and when the page is loaded, if I click on a button, data is loaded and displayed on the chart.
I wrote this code but it doesn't work.
def _op_produttivitaRidge1day(db, custom_attrs, start_date, end_date, postazione, stazione: str, mongo_coll, hours: list, hours2: list, stazione2: str, stazione3: str, cod_avaria: str):
def crosscorr(datax, datay, lag=0, wrap=False):
""" Lag-N cross correlation.
Shifted data filled with NaNs
Parameters
----------
lag : int, default 0
datax, datay : pandas.Series objects of equal length
Returns
----------
crosscorr : float
"""
if wrap:
shiftedy = datay.shift(lag)
shiftedy.iloc[:lag] = datay.iloc[-lag:].values
return datax.corr(shiftedy)
else:
return datax.corr(datay.shift(lag))
# custom data
custom_attrs = {
"OP30": ["ST7_LETTURA_INI_TRASD", "ST7_LETTURA_TRASD", "ST3_CONT_SCARTI_CONS", "ST4_CONT_SCARTI_CONS",
"ST7_CONT_SCARTI_CONS"],
"OP40": ["ST2_VAL_CRIMPATURA", "ST2_VAL_INI_CRIMPATURA", "ST5_CNT_SCARTI_CONS_CHECKER", "ST1_CONT_SCARTI_CONS",
"ST2_CONT_SCARTI_CONS", "ST5_CONT_SCARTI_CONS"],
"OP50": ["ST3_CNT_VETRINO_SALD", "ST1_VAL_PRESSIONE", "ST1_VAL_PERDITA", "ST2_CONT_SCARTI_CONS",
"ST3_CONT_SCARTI_CONS"],
"OP60": ["ST2_LETTURA_INI_TRASD", "ST3_COUNT_CONTROLLO_VETRINO", "ST4_CONT_FOTO1_COGNEX",
"ST4_CONT_FOTO2_COGNEX", "ST4_RIPROVE_SCARTO", "ST1_CONT_SCARTI_CONS", "ST2_CONT_SCARTI_CONS",
"ST3_CONT_SCARTI_CONS", "ST4_CONT_SCARTI_CONS"],
"OP70": ["ST1_CONT_SCARTI_CONS"],
"OP80": ["ST1_COUNT_CONTROLLO_VETRINO", "ST1_CONT_SCARTI_CONS", "ST2_CONT_SCARTI_CONS"],
"OP90": ["ST1_VAL_TRASD_DAMPER", "ST1_VAL_TRASD_INI_DAMPER", "ST1_VAL_TRASD_CUP_INI_DAMPER",
"ST1_VAL_TRASD_CUP_DAMPER", "ST1_CONT_SCARTI_CONS"],
"OP100": [],
"OP110": [],
"OP120": ["ST1_VAL_MISURA_PISTON", "ST1_VAL_TRASD_INI", "ST1_CONT_SCARTI_CONS"]
}
# Produttività Ridge Graph
# day, hour, number of items produced
attr_name = stazione + "_PZ_IN"
attr_value = "$" + attr_name
c5 = db[mongo_coll].aggregate([
{"$match": {"$and": [{"Timestamp": {"$gte": start_date}}, {"Timestamp": {"$lte": end_date}}]}},
# {"$match": {{"$substr": ["$Timestamp" , 0, 10]} : {"$in": days_list}}},
{"$project": {"DAY": {"$substr": ["$Timestamp", 0, 10]}, "HOUR": {"$substr": ["$Timestamp", 11, 4]},
attr_name: 1}},
{"$group": {"_id": {"DAY": "$DAY", "HOUR": "$HOUR"}, "ITEM_COUNT": {"$sum": attr_value}}},
{"$project": {"_id": 0, "DAY": "$_id.DAY", "HOUR": "$_id.HOUR", "ITEM_COUNT": 1}},
{"$sort": {"DAY": 1, "HOUR": 1}}
])
c5_df = pd.DataFrame(list(c5))
days = sorted(c5_df["DAY"].unique())
PR = figure(title="Produzione " + postazione + " " + stazione, y_range=days, plot_width=900, x_range=(-2, 208),
toolbar_location=None)
bt = Button(
label="Show data",
button_type="success",
width=50
)
def createPR(FIG, rm_num_values):
c5_df['ITEM_COUNT_RM'] = c5_df.iloc[:, 0].rolling(window=rm_num_values).mean().fillna(0)
for d in days:
y = []
for h in hours:
try:
# hf = str(int(h)).zfill(2)
hf = h
num_items = (c5_df.loc[c5_df["HOUR"] == hf].loc[c5_df["DAY"] == d].iloc[0]["ITEM_COUNT_RM"]) / 80
# print(hf,d,num_items)
if num_items > 1:
num_items = 1
except:
num_items = 0
y.append([d, num_items])
# print(y)
s5 = ColumnDataSource(data=dict(x=range(146)))
s5.add(y, d)
FIG.patch('x', d, source=s5)
FIG.outline_line_color = None
FIG.background_fill_color = "#efefef"
FIG.y_range.range_padding = 0.12
FIG.xaxis.ticker = FixedTicker(
ticks=[0, 6, 12, 18, 24, 30, 36, 42, 48, 54, 60, 66, 72, 78, 84, 90, 96, 102, 108, 114, 120, 126, 132, 138])
FIG.xaxis.major_label_overrides = {0: '0', 6: '1', 12: '2', 18: '3', 24: '4', 30: '5', 36: '6', 42: '7', \
48: '8', 54: '9', 60: '10', 66: '11', 72: '12', 78: '13', 84: '14', 90: '15', \
96: '16', 102: '17', 108: '18', 114: '19', 120: '20', 126: '21', 132: '22',
138: '23'}
FIG.outline_line_color = background
FIG.border_fill_color = background
FIG.background_fill_color = background
return FIG
#PR = createPR(PR, 3)
bt.on_click(createPR(PR, 3))
return column(bt, PR)

Answer 1

This code was written for Bokeh v2.1.1. Run it with bokeh serve -show main.py.
Replace data = dict(x=[1, 2, 3, 2], y=[6, 7, 2, 2]) with your data acquisition function: data = _op_produttivitaRidge1day(db, custom_attrs, start_date, end_date, ...) Everything should work if your function returns a dictionary with x and y vectors of equal length.
The approach is to first pass an empty data_source to the figure and then after a button click, download the data from your MongoDB and assign it as dictionary to the patch.data_source.data.
main.py:
from bokeh.plotting import curdoc, figure
from bokeh.models import Column, Button
plot = figure()
patch = plot.patch(x=[], y=[])
def callback():
data = dict(x=[1, 2, 3, 2], y=[6, 7, 2, 2]) # <-- your data acquisition function comes here
patch.data_source.data = data
button = Button()
button.on_click(callback)
curdoc().add_root(Column(plot, button))