You are trying to plot a difference x vs y plot each time you select a different x or y value from the dropdown menus.
Are you trying to do something like that? I am not sure how to do that with the bokeh server though.
from bokeh.plotting import Figure, output_file
from bokeh.models import CustomJS, ColumnDataSource, Select
from bokeh.layouts import gridplot
from bokeh.resources import CDN
from bokeh.embed import file_html
from random import random
TOOLS = “pan,wheel_zoom,box_zoom,undo,redo,reset,box_select,save”
iterable = [(‘x’+str(i),[j*(i+1) for j in range(100)]) for i in range(5)]+[(‘y’+str(i),[random()10(i+1) for j in range(100)]) for i in range(10)]
source = ColumnDataSource(data={key:value for key,value in iterable})
fillsource = ColumnDataSource(data={‘x’:source.data[‘x0’],‘y’:source.data[‘y0’],‘z’:source.data[‘y1’]})
fig1 = Figure(plot_height=400,plot_width=400,tools=TOOLS)
fig1.scatter(x=‘x’,y=‘y’,source=fillsource)
fig2 = Figure(plot_height=400,plot_width=400,tools=TOOLS,x_range=fig1.x_range)
fig2.scatter(x=‘x’,y=‘z’,source=fillsource)
x_options = sorted([k for k in source.data.keys() if ‘x’ in k])
y_options = sorted([k for k in source.data.keys() if ‘y’ in k])
selex = Select(title=‘X-axis’,options=x_options,value=x_options[0])
seley1 = Select(title=‘Y-axis left’,options=y_options,value=y_options[0])
seley2 = Select(title=‘Y-axis right’,options=y_options,value=y_options[1])
selex.callback = CustomJS(args=dict(s=source,fs=fillsource,sely1=seley1,sely2=seley2),code="""
var xval = cb_obj.get("value");
var yval1 = sely1.get("value");
var yval2 = sely2.get("value");
var d = s.get('data');
var df = fs.get('data');
df['x'] = [];
df['y'] = [];
df['z'] = [];
var x = d[xval];
var y = d[yval1];
for(i=0;i<=x.length;i++){
df['x'].push(d[xval][i]);
df['x'].push(d[xval][i]);
}
for(i=0;i<=y.length;i++){
df['y'].push(d[yval1][i]);
df['z'].push(d[yval2][i]);
}
fs.trigger("change");
""")
seley2.callback = CustomJS(args=dict(s=source,fs=fillsource,sely1=seley1,selx=selex),code="""
var yval2 = cb_obj.get("value");
var xval = selx.get("value");
var yval1 = sely1.get("value");
var d = s.get('data');
var df = fs.get('data');
df['x'] = [];
df['y'] = [];
df['z'] = [];
var x = d[xval];
var y = d[yval1];
for(i=0;i<=x.length;i++){
df['x'].push(d[xval][i]);
df['x'].push(d[xval][i]);
}
for(i=0;i<=y.length;i++){
df['y'].push(d[yval1][i]);
df['z'].push(d[yval2][i]);
}
fs.trigger("change");
""")
seley1.callback = CustomJS(args=dict(s=source,fs=fillsource,sely2=seley2,selx=selex),code="""
var yval1 = cb_obj.get("value");
var xval = selx.get("value");
var yval2 = sely2.get("value");
var d = s.get('data');
var df = fs.get('data');
df['x'] = [];
df['y'] = [];
df['z'] = [];
var x = d[xval];
var y = d[yval1];
for(i=0;i<=x.length;i++){
df['x'].push(d[xval][i]);
df['x'].push(d[xval][i]);
}
for(i=0;i<=y.length;i++){
df['y'].push(d[yval1][i]);
df['z'].push(d[yval2][i]);
}
fs.trigger("change");
""")
grid = gridplot([[seley1,seley2],[fig1,fig2,selex]],toolbar_location=‘left’)
outfile=open(‘dropdwn.html’,‘w’)
outfile.write(file_html(grid,CDN,‘dropdwn’))
outfile.close()
``