0

I've lot of ipywidgets sliders connected to a graph and I'd like to have them on the left side of the layout. In addition to that, the output graph shall be on the right side in order to optimize space and increase usability.

The result without layering is like the following picture:

result without layering

Do you have any solution to have sliders on the left side and the output on the right side?

I've already tried HBox + VBox using interactive:

inter = wgt.interactive(f_arctan2,va=wgt.FloatSlider(min=-5.,max=5.,step=0.5,value=1.5),vb=wgt.FloatSlider(min=-6,max=6,step=0.5,value=0),
             va2= wgt.FloatSlider(min=-5.,max=5.,step=0.5,value=-1), vb2= wgt.FloatSlider(min=-5.,max=5.,step=0.5,value=-3) )

display(wgt.HBox(wgt.VBox(inter.children[:-1]),inter.children[-1]))

but there is a tuple error

TypeError: init() takes from 1 to 2 positional arguments but 3 were given

Using also inter.children.Output() as second parameter doesn't work.

1 Answers1

0

The best solution I've found is using an HBox combined with a VBox.

Here is a sample:

labels = Label(y= x_labels , x= [0,0,0,0,0], scales={'y': x_ord , 'x':  y_sc}, x_offset = -49, y_offset = 7,colors=['white','white','white', 'white','white'], default_size=24,  update_on_move=True)


histogram = Figure(marks=[bar,labels], axes=[ax_x,ax_y],  background_style = {'fill': 'White'},title=total, min_height = 50, title_style ={'font-size': '30px'})


ui = wgt.HBox([wgt.VBox([logo_w,company_w,model_w, aa_w, bb_w, ccc_w,avg_w,event_w]),histogram])

Then, I've used an interactive output

def f_all(logo,company,...):
  ....code here...


out = wgt.interactive_output(f_all,{'logo':logo_w,'company': company_w, 'aa':aa_w, ...})

display(ui, out)

Hope this helps anyone :-)