Dynamic UI - Multiple Selectors

Panel
1

Hi,
I’m pretty new to Panel, and have loved making some simple standalone applications with it.
For one of my app, I needed to play with the Dynamic UI concepts of panel. Let me brief you about my expected use case -

image
image1509×358 5.17 KB

What I need is, a new DataFrame must be generated every time the user toggles any of the 3 selectors and that new DataFrame Widget must replace the existing one.

Here’s the code -

import panel as pn
import pandas as pd
pn.extension()

s1 = pn.widgets.Select(options=['A','B','C'])
s2 = pn.widgets.Select(options=['A','B','C'])
s3 = pn.widgets.Select(options=['A','B','C'])
selectorRow = pn.Row(s1,s2,s3)

df = pd.DataFrame(columns=['s1','s2','s3'])
df_widget = pn.widgets.DataFrame(df)

column = pn.Column(selectorRow,df_widget)

def createDataFrame():
    data_dict={'s1' : [s1.value, s1.value, s1.value],
               's2' : [s2.value, s2.value, s2.value],
               's3' : [s3.value, s3.value, s3.value]}
    df = pd.DataFrame(data=data_dict)
    df_widget = pn.widgets.DataFrame(df, name='DataFrame')
    column[1] = df_widget

createDataFrame()

As explained, change in value of any of the given selectors, must dynamically give us a new DataFrame.
Can someone please guide me on how I can achieve this?

Thank you.

2

It is a little tricky, but this does the job. You have to use the save method on panel with the embed=True option. Additionally, you need to set the callback with the decorator to update the widget in the column with the watch=True option. To save the html file, you need to run “python filename.py”

import panel as pn
import pandas as pd
pn.extension()

s1 = pn.widgets.Select(options=['A','B','C'])
s2 = pn.widgets.Select(options=['A','B','C'])
s3 = pn.widgets.Select(options=['A','B','C'])
selectorRow = pn.Row(s1,s2,s3)

df = pd.DataFrame(columns=['s1','s2','s3'])
df_widget = pn.widgets.DataFrame(df)

column = pn.Column(selectorRow,df_widget)

@pn.depends(s1,s2,s3, watch=True)
def createDataFrame(val1,val2,val3):
    data_dict={'s1' : [s1.value, s1.value, s1.value],
               's2' : [s2.value, s2.value, s2.value],
               's3' : [s3.value, s3.value, s3.value]}
    df = pd.DataFrame(data=data_dict)
    df_widget = pn.widgets.DataFrame(df)
    column[1] = df_widget
    


column.save('df_save_panel.html', embed=True)
# column.servable()
1 Like
3

Thanks for this!