Боке: Изменение точек на карте на основе ползунка

Question

Я пытаюсь расширить свои навыки черчения и начал играть с Боке.

Теперь я хочу сделать что-то, что в моей голове кажется очень простым, но я не могу понять, как это сделать.

У меня есть три события по три раза в каждом.Теперь я хочу показать на карте различные точки, соответствующие времени, выбранному с помощью ползунка.

Код, приведенный ниже, - это то, что я получил до сих пор, но график карты не хочет обновляться.

import pandas as pd

from bokeh.io import show, output_notebook    
from bokeh.models import ColumnDataSource, HoverTool, LinearColorMapper    
from bokeh.tile_providers import CARTODBPOSITRON
from bokeh.plotting import figure, show
from bokeh.layouts import column, widgetbox
from bokeh.models import CustomJS, Slider

TOOLS = "pan,wheel_zoom,reset,save"

points = pd.DataFrame(data = {'x': [1, 2, 3, 1, 2, 3, 1, 2, 3], 
                              'y': [4, 5, 6, 5, 6, 4, 6, 4, 5],
                             'time': [1, 1, 1, 2, 2, 2, 3, 3, 3]})

visible_points = points[(points['time'] == 1)]

source_visible = ColumnDataSource(data=dict(x=visible_points['x'], y=visible_points['y'], time=visible_points['time']))
source_available = ColumnDataSource(data=dict(x=points['x'], y=points['y'], time=points['time']))

mapplot = figure(title="Slider Test Plot", tools=TOOLS, width=950, height=650)
mapplot.add_tile(CARTODBPOSITRON)
mapplot.circle(x="x", y="y", size=15, fill_color="blue", fill_alpha=0.2, source=source_visible)

slider = Slider(title='Time',
                value=1,
                start=1,
                end=3,
                step=1)

slider.callback = CustomJS(args=dict(source_visible = source_visible, source_available = source_available), code="""
        var time_val = cb_obj.value;
        // Get the data from the data sources
        var point_visible = source_visible.data;
        var point_available = source_available.data;
        // Update the visible data
        for(var i = 0; i < point_available.length; i++) {  
            if (point_available['time'][i] == time_val){
                point_visible.x = point_available['x'][i];
                point_visible.y = point_available['y'][i];
            }   
        }
        source_visible.change.emit();
    """)


layout = column(mapplot, slider)

show(layout)

Любая обратная связь с благодарностью!

Answer 1

Через несколько часов мне наконец-то удалось починить слайдер. Следующий обратный вызов заставляет его работать:

slider.callback = CustomJS(args=dict(source_visible = source_visible, source_available = source_available), code="""
    var time_val = cb_obj.value;
    // Get the data from the data sources
    var point_visible = source_visible.data;
    var point_available = source_available.data;

    point_visible.x = []
    point_visible.y = []

    // Update the visible data
    for(var i = 0; i < point_available.x.length; i++) {  
        if (point_available.time[i] == time_val){
            point_visible.x.push(point_available.x[i]);
            point_visible.y.push(point_available.y[i]);
        }   
    }
    source_visible.change.emit();
""")

Answer 2

Я думаю, это потому, что вы ошиблись point_available.lenght ...