从 javascript 设置一个 ipython 小部件值？

Question

假设在IPython笔记本中创建了一个ipywidget，像这样：

from ipywidgets import widgets
i = widgets.IntText()

有没有办法设置 Javascript 的值？我怀疑我需要知道小部件的一些 comm id。或者是否有更好的方法让 Python 中的变量从 Javascript 设置？

用例是我想将鼠标点击位置（通过Javascript获得）位置发送回Python。

Answer 1

您可以使用 ipython jslink 小部件在 JavaScript 端绑定小部件模型。

from ipywidgets import IntText, IntSlider, jslink
from IPython.display import display

text, slider = IntText(), IntSlider()
link = jslink((text, 'value'), (slider, 'value'))
display(text, slider)

如果您想要一个纯粹的 JavaScript 解决方案，您可以使用小部件 ID 从小部件管理器中找到小部件模型。

Answer 2

感谢 ipython gitter 上的 SylvainCorlay 和 jasongrout，他们能够帮我解决这个问题：

clicked = function (evt, x_model, y_model) {
    var e = evt.srcElement.farthestViewportElement || evt.target;
    var dim = e.getBoundingClientRect();
    var x = evt.clientX - dim.left;
    var y = evt.clientY - dim.top;
    var manager = IPython.WidgetManager._managers[0];
    var model_prom = manager.get_model(x_model);
    model_prom.then(function(model) {
        model.set('value', Math.round(x));
        model.save_changes();
    });
    model_prom = manager.get_model(y_model);
    model_prom.then(function(model) {
        model.set('value', Math.round(y));
        model.save_changes();
    });
};

其中 onclick 与事件一起调用，Python x.model_id 和 y.model_id。

Answer 3

如果你能安装jupyter代理服务器就可以使用这个notebook

https://github.com/gbrault/jpjwidgets

从 javascript 设置一个 ipython 小部件值？

Set an ipython widget value from javascript?

javascript

ipython

jupyter