voila-dashboards / voila

Voilà turns Jupyter notebooks into standalone web applications
https://voila.readthedocs.io
Other
5.46k stars 506 forks source link

Less readable when horizontally combining dataframe using ipywidgets #1492

Open YongcaiHuang opened 1 month ago

YongcaiHuang commented 1 month ago

Description

different display between voila and notebook when using ipywidgets to combine dataframes. In voila, it's less readable.

Reproduce

  1. Run below example code
  2. Open voila preview inside the jupyterlab
  3. compare the display between output in notebook and voila
from ipywidgets import Output, HBox
import pandas as pd

def horizontally_display(dataframes):
    outputs = []

    for df in dataframes:
        output = Output()
        with output:
            display(df)
        outputs.append(output)

    hbox = HBox(outputs)
    display(hbox)

_sr_value = ["XXXXXXXXXXXXXXXXXXXX", "XXXXXXXXXXXXXXXXXXXX", "XXXXXXXXXXXXXXXXXXXX", "XXXXXXXXXXXXXXXXXXXX"]
_df = pd.DataFrame(
    {
        "A": _sr_value,
        "B": _sr_value,
        "C": _sr_value
    }
)

horizontally_display([_df] * 4)

https://github.com/user-attachments/assets/f00f5775-b5a3-4dc9-a601-d31e35ae0b5c

https://github.com/user-attachments/assets/b86c0bd9-3e67-4e4e-9196-dd2fe271205a

Expected behavior

the display in notebook is well readable. expected behavior is the same display as in notebook

Context

If using JupyterLab

Installed Labextensions

jupyterlab-rainbow-brackets v0.1.0 enabled OK (python, jupyterlab_rainbow_brackets)
jupyter_copilot v0.1.1 enabled OK (python, jupyter_copilot)
jupyterlab_pygments v0.3.0 enabled OK (python, jupyterlab_pygments)
jupyterlab-unfold v0.3.2 enabled OK (python, jupyterlab-unfold)
jupyter-matplotlib v0.11.4 enabled OK
jupyterlab-execute-time v3.2.0 enabled OK (python, jupyterlab_execute_time)
jupyterlab_hide_code v4.0.0 enabled OK (python, jupyterlab_hide_code)
@jupyter-server/resource-usage v1.1.0 enabled OK (python, jupyter-resource-usage)
@pyviz/jupyterlab_pyviz v3.0.3 enabled OK
@jupyter-lsp/jupyterlab-lsp v5.1.0 enabled OK (python, jupyterlab-lsp)
@voila-dashboards/jupyterlab-preview v2.3.7 enabled OK (python, voila)
@jupyter-widgets/jupyterlab-manager v5.0.13 enabled OK (python, jupyterlab_widgets)
YongcaiHuang commented 1 month ago

similar problem shows when plotting in svg format. it's not readable.

import pandas as pd
import pingouin as pg
import numpy as np
from ipywidgets import HBox, Output
import matplotlib.pyplot as plt
%config InlineBackend.figure_format = 'svg'

def horizontally_display(objs):
    outputs = []

    for obj in objs:
        output = Output()
        with output:
            display(obj)
        outputs.append(output)

    hbox = HBox(outputs)
    display(hbox)

data = pg.read_dataset("anova2")
data_piv = data.pivot_table("Yield", "Blend", "Crop")

figs = [data_piv.plot(kind='barh', figsize=[6,3]).get_figure() for i in range(6)]
plt.close('all')
horizontally_display(figs)

https://github.com/user-attachments/assets/924ba9cc-8ef0-433b-8314-5d537bc633ca