Tabulator renders blank for DataFrame with MultiIndex

[wahsmail]

ALL software version info

(this library, plus any other relevant software, e.g. bokeh, python, notebook, OS, browser, etc should be added within the dropdown below.)

Software Version Info

INSTALLED VERSIONS
------------------
commit              : a671b5a8bf5dd13fb19f0e88edc679bc9e15c673
python              : 3.10.14.final.0
python-bits         : 64
OS                  : Windows
OS-release          : 10
Version             : 10.0.19045
machine             : AMD64
processor           : AMD64 Family 25 Model 97 Stepping 2, AuthenticAMD
byteorder           : little
LC_ALL              : None
LANG                : None
LOCALE              : English_United States.1252

panel: 1.6.2
pandas: 2.1.4
numpy: 1.23.5
ipython: 8.34.0
ipywidgets: 8.1.5
bokeh: 3.7.2
jupyterlab: 4.4.0
jupyter_bokeh: 4.0.5

Description of expected behavior and the observed behavior

Tabulators don't properly render when the DataFrame pass has both a multiindex index and multiindex columns. show_index=False results in the widget being totally blank, show_index=True results in all index entries being blank but the dataframe otherwise displaying properly.

Complete, minimal, self-contained example code that reproduces the issue

import itertools
import numpy as np
import pandas as pd
import panel as pn

pn.extension('tabulator')

places = ['New York', 'Chicago', 'London']
people = ['Alice', 'Bob', 'Charlie']
colors = ['Red', 'Green', 'Blue']

df = pd.DataFrame(itertools.product(places, people, colors), columns=['place', 'person', 'color'])
df['x1'] = np.random.normal(size=df.shape[0])
df['x2'] = np.random.normal(size=df.shape[0])
df = df.pivot(index=['place', 'person'], columns='color', values=['x1', 'x2'])

pn.widgets.Tabulator(df, show_index=False)  # I get totally blank result
pn.widgets.Tabulator(df, show_index=True)  # Index entries all blank, but otherwise Tabulator looks normal

Stack traceback and/or browser JavaScript console output

n/a

Screenshots or screencasts of the bug in action

• I may be interested in making a pull request to address this

[etihwo]

The commit ecf58d4 will partially solve this issue.
However since in the example the dataframe has multiindex and mutlicolumn (with 2 level), the index column will be 'place_', 'person_' and not 'place', 'person' as expected by the column definition, this explain why the index column are empty.

import itertools

import numpy as np
import pandas as pd
import panel as pn

pn.extension("tabulator")

places = ["New York", "Chicago", "London"]
people = ["Alice", "Bob", "Charlie"]
colors = ["Red", "Green", "Blue"]

df = pd.DataFrame(itertools.product(places, people, colors), columns=["place", "person", "color"])
df["x1"] = np.random.normal(size=df.shape[0])
df["x2"] = np.random.normal(size=df.shape[0])
df = df.pivot(index=["place", "person"], columns="color", values=["x1", "x2"])

table = pn.widgets.Tabulator(df, show_index=True)  # I get totally blank result
model = table.get_root()

print(model.configuration["columns"])

[
    {"field": "place"},
    {"field": "person"},
    {
        "columns": [
            {"field": "x1_Blue", "sorter": "number"},
            {"field": "x1_Green", "sorter": "number"},
            {"field": "x1_Red", "sorter": "number"},
        ],
        "title": "x1",
    },
    {
        "columns": [
            {"field": "x2_Blue", "sorter": "number"},
            {"field": "x2_Green", "sorter": "number"},
            {"field": "x2_Red", "sorter": "number"},
        ],
        "title": "x2",
    },
]

print(model.source.data)

{
    "index": array([0, 1, 2, 3, 4, 5, 6, 7, 8]),
    "place_": array(["Chicago", "Chicago", "Chicago", "London", "London", "London", "New York", "New York", "New York"], dtype=object),
    "person_": array(["Alice", "Bob", "Charlie", "Alice", "Bob", "Charlie", "Alice", "Bob", "Charlie"], dtype=object),
    "x1_Blue": array([0.39200224, 0.09416976, 0.37302068, 1.05907549, -0.35736758, 0.08291129, 0.07301411, -1.3748418, -0.57052385]),
    "x1_Green": array([0.05066625, -1.82493928, 2.11921462, -0.26741111, -0.19878332, -0.01453422, 1.6202588, 0.45132907, -0.03496575]),
    "x1_Red": array([1.0093835, -0.42363247, 0.60084746, 2.44946272, -0.66640002, 0.69326084, -1.35373274, 2.31385261, 0.51304681]),
    "x2_Blue": array([-0.71770511, -0.7746485, -0.47237323, 0.1625558, -1.08413419, -1.47026889, -0.68665419, -0.08595487, -1.23020514]),
    "x2_Green": array([0.05400765, 0.29940986, 0.75288752, 0.05384395, -0.35070451, 1.37260442, -0.11454651, -0.97261999, -0.18091916]),
    "x2_Red": array([-0.75261088, -0.02326824, 1.73666105, 0.67856695, 0.58883998, 0.35096266, -1.84994995, 1.11354719, -0.0299902]),
}

To solve this issue, I see 2 solutions :

• modify model.configuration["columns"] to have 'place_', 'person_'
• modify model.source.data to have 'place', 'person'

Any idea about which one should be prefered ?

[philippjfr]

Thanks for digging into this. Let's update the configuration.

[etihwo]

Just to be sure, if I update the configuration, it will also impact the indexes property which will return ["place_", "person_"]. Is it what you expect ?
And without any title specification, the table will be like :

[github-actions]

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.