Problem with interactivity when rendering bokeh tiles and panel tabulator simultaneously

Panel
,
1

Running this code with panel 1.7.0 and bokeh 3.7.3 I cannot select rows in the tabulator.

class MapTable(WidgetBase, PyComponent):
    _tab = param.ClassSelector(class_=pn.widgets.Tabulator)
    _map = param.ClassSelector(class_=figure)
    
    def __init__(self, **params):
        super().__init__(**params)
        data = pd.DataFrame({'A': [1,2,3]})
        self._tab = pn.widgets.Tabulator(data)
        self._map = figure()
        self._map.add_tile("CartoDB Positron")
    
    def __panel__(self):
        return pn.Row(self._tab, pn.pane.Bokeh(self._map, sizing_mode="stretch_both"))
        
    MapTable()

If I do not add tiles to the bokeh figure, the probelm disappears:

class MapTable(WidgetBase, PyComponent):
    _tab = param.ClassSelector(class_=pn.widgets.Tabulator)
    _map = param.ClassSelector(class_=figure)
    
    def __init__(self, **params):
        super().__init__(**params)
        data = pd.DataFrame({'A': [1,2,3]})
        self._tab = pn.widgets.Tabulator(data)
        self._map = figure()
    
    def __panel__(self):
        return pn.Row(self._tab, pn.pane.Bokeh(self._map, sizing_mode="stretch_both"))
        
    MapTable()

Is this a bug, or am I supposed to do it differently?

2

I don’t think widgets are supposed to be parameters, i.e. _tab should be param.DataFrame, and _map, perhaps the data; see Parameterized objects (e.g. Panel Widgets) as class attributes · Issue #832 · holoviz/param · GitHub

Then you would do something like pn.widgets.Tabulator.from_param(self.param._tab)

3

I think it is fine, I use param.ClassSelector as your reference suggests. Pretty sure the problem would persist even if they are not in a class, I should provide a more minimal exemple.

1 Like
4

Yes. Please provide minimum, reproducible example.

1 Like
5 
# tabulator not selectable:

import pandas as pd
import panel as pn
from bokeh.plotting import figure

pn.extension('tabulator')

data = pd.DataFrame({'A': [1,2,3]})
tab_widget = pn.widgets.Tabulator(data)
map_widget = figure()
map_widget.add_tile("CartoDB Positron")

pn.Row(tab_widget, map_widget)

# tabulator is selectable:

import pandas as pd
import panel as pn
from bokeh.plotting import figure

pn.extension('tabulator')

data = pd.DataFrame({'A': [1,2,3]})
tab_widget = pn.widgets.Tabulator(data)
map_widget = figure()
# map_widget.add_tile("CartoDB Positron")  #  <---- 

pn.Row(tab_widget, map_widget)

I worked around the problem by using a FastListTemplate and putting the tabulator in the sidebar and the map in the main section.

The browser is Edge. Problem in both jupyterlab notebook and using panel serve.

panel==1.7.0
bokeh=3.7.3