Как обновить исходный код Bokeh с помощью CustomJS - PullRequest
Новая
       3

Как обновить исходный код Bokeh с помощью CustomJS

1 голос
/ 19 февраля 2020

У меня возникают некоторые проблемы при попытке обновить мой источник Bokeh при использовании виджета Select и пользовательского JS. Custom JS является обязательным требованием в этом случае, поэтому нельзя использовать def: function. Приведенный ниже код возвращает визуализацию данных, но он не обновляет sh, так как, я думаю, код JS написан неправильно, и у меня нет возможности отладить его (если кто-то знает, как, пожалуйста, это действительно лучший ответ, который я мог получить).

Основная идея состоит в том, чтобы отфильтровать мой источник на основе значения, выбранного в виджете Выбор.

Любые идеи ?? 


source = ColumnDataSource(data=dict(
    x=gx,
    y=gy,
    recty=recty,
    colors=colors,
    filter_info= filter_info))


select = Select(title="Option:", value="All", options=["All", "1", "2", "3", "4", "5", "6+"])

renderer_source = source

# Add the slider
code = """
    var value_filter_info = cb_obj.value;

    if value_assignments == 'All' { 
      new_source_data['x'] =  source.data['x'];
      new_source_data['y'] =  source.data['y'];
      new_source_data['recty'] =  source.data['recty'];
      new_source_data['colors'] =  source.data['colors'];
    } else {
      new_source_data['x'] =  source.data['x'][source.data['filter_info']==value_filter_info];
      new_source_data['y'] =  source.data['y'][source.data['filter_info']==value_filter_info];
      new_source_data['recty'] =  source.data['recty'][source.data['filter_info']==value_filter_info];
      new_source_data['colors'] =  source.data['colors'][source.data['filter_info']==value_filter_info];

    }

    renderer_source.data= new_source_data;
    renderer_source.change.emit();

"""

callback = CustomJS(args=dict(source=source, renderer_source=renderer_source), code=code)
select.js_on_change('value', callback)


p = figure(plot_width=1200, plot_height=400, x_range=(0,100), y_range=(0,1000))

p.rect(x='x', y='recty',  width=1, height=1, color='colors', source=renderer_source, line_color=None, fill_alpha=1, width_units="data", height_units="data")

plot_layout = column(select,p)
show(plot_layout)
output_notebook()

Большое спасибо!

1 Ответ

0 голосов
/ 19 февраля 2020

Итак, я нашел решение, которое может быть эстетически, программно и визуально улучшено, но, по крайней мере, результат показан.

Следуя совету @bigreddot по индексированию и перезаписи , я удалось написать текущий код Custom JS: 

code = """
    var render=renderer_source.data;
    var data=source.data;
    var data_assignment = data['assignments']; 
    var value_assignments = cb_obj.value; 


    var data_x=data['x'];
    var data_y=data['y'];
    var data_recty=data['recty'];
    var data_colors=data['colors'];

    var render_x=render['x'];
    var render_y=render['y'];
    var render_recty=render['recty'];
    var render_colors=render['colors'];

    var x = [];
    var y = [];
    var recty = [];
    var colors = [];

    render_x=[];
    render_y=[];
    render_recty=[];
    render_colors=[];


    for (var i=0;i<data_assignment.length; i++){

        if (value_assignments == 'All') { 
          x.push(data_x[i]);
          y.push(data_y[i]);
          recty.push(data_recty[i]);
          colors.push(data_colors[i]);
        } else if (data_assignment[i]==value_assignments) {
          x.push(data_x[i]);
          y.push(data_y[i]);
          recty.push(data_recty[i]);
          colors.push(data_colors[i]);

        }
    }

    renderer_source.data['x']=x;
    renderer_source.data['y']=y;
    renderer_source.data['recty']=recty;
    renderer_source.data['colors']=colors;

    renderer_source.change.emit();

"""
...