I have a layout that consists of a dropdown widget (with a JS callback function) that filters the data, a graph with circles and a text widget. I want to show the value of the selected dropdown item in the text widget. I created a second callback function but quite not figured how to do it.
Below is a snippet:
callback = CustomJS(args=dict(source=source, temp_source = source_temp), code="""
var temp_data = temp_source.data;
var data = source.data;
const column_names = Object.keys(data)
var temp_object = []
for (var i = 0; i < data.Load_Name.length; i++) {
var temp_obj = {}
if (data.Load_Name[i]===this.item){
for (const [key, value] of Object.entries(data)) {
temp_obj[key] = value[i];
}
temp_object.push(temp_obj)
}
}
let filtered_data = temp_object.reduce((a, e, i) => {
Object.entries(e).forEach(function(t) {
(a[t[0]] = a[t[0]] || []).push(t[1]);
})
return a;
}, {});
temp_source.data = filtered_data;
console.log(data);
temp_source.change.emit();
""")
load_case_name = ""
callback_getname = CustomJS(args = dict(load_case_name = load_case_name), code="""
var load_case_name = this.item;
console.log(load_case_name)
load_case_name.change.emit();
""")
load_case_list = np.unique(df['Load_Name'].values)
dropdown = Dropdown(label="Select A Load Case", button_type="primary",
menu=list(load_case_list))
dropdown.js_on_event("menu_item_click", callback, callback_getname)
div = Div(text=load_case_name, width=200, height=100)