Hello All,
I am using the tabular widget and I would like to have the table only as big as the data it shows.
Current implementation can be seen in the above image. What I want, is that the table and the button below it to be up to the redline, in this case.
Here is my code:
import panel as pn
import pandas as pd
pn.extension("tabulator", css_files=[pn.io.resources.CSS_URLS['font-awesome']], notifications=True)
def check_assessment(status):
color = 'black'
if status == 'True':
color = 'green'
elif status == 'False':
color = 'red'
return 'color: %s' % color
def feedback_event(event):
print(report_df)
pn.state.notifications.info(
'Feedback sent',
duration=2000,
)
img11_path = 'assets/demo_images/Image1_1.png'
img21_path = 'assets/demo_images/Image2_1.png'
img12_path = 'assets/demo_images/Image1_2.png'
img22_path = 'assets/demo_images/Image2_2.png'
feedback_button = pn.widgets.Button(name='Send feedback', button_type='primary', width=200)
feedback_button.on_click(feedback_event)
report_df = pd.DataFrame(
data={
'Steps': ['Step1', 'Step2'],
'Assessment': ['True', 'False'],
'ExpectedImage': [img11_path, img21_path],
'ActualImage': [img21_path, img22_path],
'True': ['True', 'True'],
'False': ['False', 'False'],
'Uncertain': ['False', 'False']
},
index=[1, 2]
)
tabulator_formatters = {
'True': {'type': 'tickCross'},
'False': {'type': 'tickCross'},
'Uncertain': {'type': 'tickCross'},
'ExpectedImage': {'type': 'image'},
'ActualImage': {'type': 'image'}
}
tabulator_editors = {
'Steps': None,
'Assessment': None,
'ExpectedImage': None,
'ActualImage': None,
'True': {'type': 'tickCross'},
'False': {'type': 'tickCross'},
'Uncertain': {'type': 'tickCross'}
}
report = pn.widgets.Tabulator(
report_df,
name='Report from 07.09.2022, 15:46:36',
layout='fit_data',
header_align='center',
text_align='center',
selectable=False,
formatters=tabulator_formatters,
editors=tabulator_editors
)
report.style.applymap(check_assessment, subset=['Assessment'])
template = pn.template.FastListTemplate(
site="Report feedback",
title="",
theme_toggle=False,
header_background="rgb(95,158,209)",
main=[pn.Column(report, feedback_button)]
)
template.servable()
Any suggestion is highly appreciated, thank you!
Regards,
Sorin