Wie bekomme ich Bokeh DataTable Zelleninhalte auf Klick?

Question

Wissen Sie, wie Sie Bokeh DataTable-Zellenwerte erhalten, indem Sie darauf klicken?

Wenn ich benutze:

data = dict(
items=bokehItems, 
    values0=bokehValues0, 
    values1=bokehValues1, 
    values2=bokehValues2 
) 

source = ColumnDataSource(data) 

columns = [ 
    TableColumn(field="items", title="Item"), 
    TableColumn(field="values0", title="Value"), 
    TableColumn(field="values1", title="Cluster"), 
    TableColumn(field="values2", title="Interaction"), 
] 



data_table_worst_cases = DataTable(source=source, columns=columns, height=280, 
            row_headers=False, fit_columns=True) 


source.callback = CustomJS(args=dict(source=source), code=""" 
    console.log(cb_obj.get('data')); 
""") 

Wenn ich in der Tabelle klicken Ich bekomme immer den Inhalt der kompletten Tabelle, nicht die bestimmte Zelle.

Answer 1

Sie haben den gesamten Code nicht veröffentlicht, daher ist es schwierig, Ihnen eine direkte Antwort zu geben. Aber basierend auf dem folgenden Beispiel sollten Sie in der Lage sein, herauszufinden, wie Sie Ihr Problem lösen können.

from random import randint 
import bokeh 
import bokeh.plotting 
from datetime import date 

data = dict(dates = [date(2014, 3, i + 1) for i in range(10)], 
      downloads = [randint(0, 100) for i in range(10)], 
      identities = ['id_' + str(x) for x in range(10)]) 

source = bokeh.models.ColumnDataSource(data) 

columns = [bokeh.models.TableColumn(field = "dates", title = "Date", 
      formatter = bokeh.models.DateFormatter()), 
      bokeh.models.TableColumn(field = "downloads", title = "Downloads")] 

source.callback = bokeh.models.CustomJS(args = dict(source = source), code = """ 
     console.log('Selected rows:'); 
     data = source.data 
     var indices = source.selected["1d"].indices; 

     for (var i = 0; i<indices.length; i++) 
     { 
      console.log(i+":"+indices[i]); 
      console.log(data['dates'][source.selected["1d"].indices[0]]); 
      console.log(data['downloads'][source.selected["1d"].indices[0]]); 
      console.log(data['identities'][source.selected["1d"].indices[0]]); 
     } 
     """) 
data_table = bokeh.models.DataTable(source = source, columns = columns, width = 400, height = 280, editable = True) 

bokeh.io.show(data_table) 

Answer 2

Oder eine andere Version mit Python Rückruf:

from random import randint 
from datetime import date 
from bokeh.models import ColumnDataSource, TableColumn, DateFormatter, DataTable 
from bokeh.layouts import column 
from bokeh.models.widgets import TextInput 
from bokeh.client import push_session 
from bokeh.plotting import curdoc 

data = dict(dates = [date(2014, 3, i + 1) for i in range(10)], 
      downloads = [randint(0, 100) for i in range(10)], 
      identities = ['id_' + str(x) for x in range(10)]) 

source = ColumnDataSource(data) 

columns = [TableColumn(field = "dates", title = "Date", 
      formatter = DateFormatter()), 
      TableColumn(field = "downloads", title = "Downloads")] 

data_table = DataTable(source = source, columns = columns, width = 400, height = 280, editable = True) 
table_row = TextInput(value = '', title = "Row index:") 
table_cell_column_1 = TextInput(value = '', title = "Date:") 
table_cell_column_2 = TextInput(value = '', title = "Downloads:") 

def function_source(attr, old, new): 
    try: 
     selected_index = source.selected["1d"]["indices"][0] 
     table_row.value = str(selected_index) 
     table_cell_column_1.value = str(source.data["dates"][selected_index]) 
     table_cell_column_2.value = str(source.data["downloads"][selected_index]) 
    except IndexError: 
     pass 

source.on_change('selected', function_source) 

session = push_session(document = curdoc()) 
curdoc().add_root(column(data_table, table_row, table_cell_column_1, table_cell_column_2)) 
session.show() 
session.loop_until_closed() 

Answer 3

Und hier ist, wie Sie auch zwischen Tabellenspalten unterscheiden kann, die angeklickt werden:

from random import randint 
from datetime import date 
from bokeh.models import ColumnDataSource, TableColumn, DateFormatter, DataTable, CustomJS 
from bokeh.layouts import column 
from bokeh.models.widgets import TextInput 
from bokeh.client import push_session 
from bokeh.plotting import curdoc 

selected_source = ColumnDataSource({'column': [-1], 'row': [-1]}) 
source = ColumnDataSource(dict(dates = [date(2014, 3, i + 1) for i in range(10)], downloads = [randint(0, 100) for i in range(10)])) 

columns = [TableColumn(field = "dates", title = "Date", formatter = DateFormatter()), TableColumn(field = "downloads", title = "Downloads")] 
data_table = DataTable(source = source, columns = columns, width = 400, height = 280, editable = True) 

text_row = TextInput(value = None, title = "Row index:") 
text_column = TextInput(value = None, title = "Column Index:") 
text_date = TextInput(value = None, title = "Date:") 
text_downloads = TextInput(value = None, title = "Downloads:") 

def table_click(row, column): 
    print ('Row %s Column %s clicked' % (row, column)) 

source_code = """ 
var grid = document.getElementsByClassName('grid-canvas')[0].children; 
var row = ''; 
var col = ''; 

for (var i=0,max=grid.length;i<max;i++) 
{ 
    if (grid[i].outerHTML.includes('active')) 
    { 
     row=i; 
     for (var j = 0, jmax = grid[i].children.length; j < jmax; j++) 
     { 
      if(grid[i].children[j].outerHTML.includes('active')) 
       { col = j } 
     } 
    } 
} 

new_data = {'column': [col], 'row': [row]}; 
source.data = new_data 
""" 

source.callback = CustomJS(args = dict(source = selected_source), code = source_code) 

def function_source(attr, old, new): 
    try: 
     selected_index = source.selected["1d"]["indices"][0] 
     text_row.value = str(selected_source.data["row"][0]) 
     text_date.value = str(source.data["dates"][selected_index]) 
     text_downloads.value = str(source.data["downloads"][selected_index]) 
     text_column.value = str(selected_source.data["column"][0]) 
     source.selected.update({"0d":{"indices": []}, "1d":{"indices":[]}, "2d":{"indices":[]}}) 
     table_click(selected_source.data["row"][0], selected_source.data["column"][0]) 
    except IndexError: 
     pass 

source.on_change('selected', function_source) 

session = push_session(document = curdoc()) 
curdoc().add_root(column(data_table, text_row, text_column, text_date, text_downloads)) 
session.show() 
session.loop_until_closed()