[Share] visdcc.DataTable - a dash component for antd.table

In the existing visdcc package, I add an new conponent for plotting antd’s table, you can get the selected props from the table, like this example on my github …
image

6 Likes

Hey, this looks really cool. Is there any way to embed links in the table?

Cheers,
Ben

visdcc.DataTable can’t do it currently because it’s not designed …
maybe it can work for some function when the cell clicked and appcallback :thinking:

@app.callback(
    Output(?????????),
    [Input('table', 'selectedcell')])
def myfun(x): 
    if x == None  : return('')
    else          : some function

dcc.Location can be used to edit the existing page’s location but it can’t be used to create a new tab

how to change columns width?

maybe you can set style = {‘width’:‘45%’} or
you can set each columns for the data prop. of visdcc.DataTable

    col = [{'title': i,
            'dataIndex': i,
            'key': i,
            'Is_sort': True, 
            'Is_click': True,
            'width': 200}  for i in df.columns]
    col[0]['fixed'] = True
    data = {'dataSource': your_dataSource,
            'columns': col                  }

If I use the callback to display the table, I need to click the button multiple times to activate the sorting and selection function. Can you help solve this problem?

app.layout=html.Div([
html.Button(‘output’,id=‘output-btn’),
html.Div(‘output’)
])
@app.callback(
Output(‘output’, ‘children’),
[Input(‘output-btn’, ‘n_clicks’)])
def update_wordcloud(n_clicks):
if n_clicks is None:
raise PreventUpdate
return visdcc.DataTable(id = ‘table’ ,
box_type = ‘radio’,
data = DF_SAMPLE,
scroll = {‘y’:200},
pagination = {‘pageSize’: 5},
style = {‘width’:‘100%’})

1 Like

your html.Div(‘output’) has no id :slightly_smiling_face:
the correct code as following

app.config['suppress_callback_exceptions'] = True

app.layout=html.Div([
    html.Button('output',id='output-btn'),
    html.Div(id = 'output')
])

app.config['suppress_callback_exceptions']=True

@app.callback(
Output('output', 'children'),
[Input('output-btn', 'n_clicks')])
def update_wordcloud(n_clicks):
    if n_clicks is None:
        raise PreventUpdate
    return visdcc.DataTable(id = 'table2',
                            box_type = 'radio',
                            data = DF_SAMPLE,
                            scroll = {'y':200},
                            pagination = {'pageSize': 5},
                            style = {'width':'100%'})