Как получить доступ и обновить графики или виджеты Bokeh, используя внешний код JavaScript? - PullRequest
Новая
       36

Как получить доступ и обновить графики или виджеты Bokeh, используя внешний код JavaScript?

1 голос
/ 24 октября 2019

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

Я знаю, как сделать то же самое, если все было полностью разработано в JS. Но я пишу внешнюю функцию JS, встроенную в HTML-файл, и я не знаю, как получить доступ к объектам Bokeh (в данном случае Slider) и управлять ими. Я могу использовать функции обратного вызова только для запуска с ползунка и изменения базовых данных, но не наоборот. Мне нужно установить значение ползунка с помощью кнопки на текущее время! 

callback = CustomJS( JS Code to cahnge the data; )

Timeslider = DateSlider(start=dt(2019, 9, 1, 16, 0, 0), end=dt(2019, 9, 2, 8, 0, 0), value=dt(2019, 9, 1, 16, 0, 0), step=1) 

callback.args['time_slider'] = Timeslider
Timeslider.js_on_change('value', callback)

1 Ответ

0 голосов
/ 24 октября 2019

Вы можете встроить другую библиотеку JS в часть block postamble шаблона Bokeh, как описано здесь . Затем, если вы дадите своему слайдеру имя, вы сможете получить к нему доступ следующим образом:

Python: 

slider = Slider(start=0, end=10, value=5, name='my_slider')

JS: 

var slider = Bokeh.documents[0].get_model_by_name('my_slider')
console.log('slider value before:', slider.value)
slider.value = 10
console.log('slider value after:', slider.value)

Это предполагает, что у вас есть толькоодин Bokeh document в вашем приложении (обратите внимание, что 0 index в documents[0]). Затем вы можете обращаться к объекту Slider и манипулировать им так же, как и при обратном вызове CustomJS, но учтите, что cb_obj и cb_data в этом случае недоступны.

См. Полный рабочий примерниже (Bokeh v1.3.0):

external_js.py: 

from bokeh.io import save
from bokeh.models import Slider, Column
from bokeh.util.browser import view

template = """
{% block postamble %}
    <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
    <script>
        $(document).ready(function() {
            var slider = Bokeh.documents[0].get_model_by_name('my_slider')
            console.log('slider value before:', slider.value)
            slider.value = 10
            console.log('slider value after:', slider.value)
        });
    </script>
{% endblock %}
"""

slider = Slider(start=0, end=10, value=5, name='my_slider')

save(Column(slider), template=template)
view("external_js.html")
...