如何在 BokehJS 中使用 CustomJS?

How to use CustomJS in BokehJS?

由于 BokehJS 相对较新,我正在努力寻找一个工作示例来展示 CustomJS 与 BokehJS 的用法。我希望事情与在 python 中使用 CustomJS 有所不同,因为应该可以在 BokehJS 中直接提供 javascript 函数作为 CustomJS 的参数,而不是在使用 CustomJS 在 python.

在没有任何进一步信息的情况下,我最好的猜测是以下代码,它旨在在平移或缩放用户操作时更新时在控制台中打印 x 轴的下限,并且它不起作用。

任何人都可以更正此问题并展示 BokehJS 中 CustomJS 的正确用法吗?

编辑:使用 Github 上提供的解决方案更新示例。谢谢!

<html>
<head>
    <link rel="stylesheet" href="https://cdn.bokeh.org/bokeh/release/bokeh-0.12.10.css" type="text/css" />
    <script type="text/javascript" src="https://cdn.bokeh.org/bokeh/release/bokeh-0.12.10.js"></script>
    <script type="text/javascript" src="https://cdn.bokeh.org/bokeh/release/bokeh-api-0.12.10.js"></script>
    <!-- The order of CSS and JS imports above is important. -->

</head>
<body>
    <div id="myPlot">
    </div>
    <script type="text/javascript">
    // data to plot
    var source = new Bokeh.ColumnDataSource({
        data: { x: [0,1,2,3,4,5,6,7,8,9], y: [0,1,4,-2,2,5,0,2,1,1] }
    });

    // make the plot and add some tools
    var tools = "pan,crosshair,wheel_zoom,box_zoom,reset,save";

    var plot = Bokeh.Plotting.figure({
        title:"demo plot",
        tools: tools,
        toolbar_location:"above",
        sizing_mode:"stretch_both"
    });

    var scatterData = plot.line({ field: "x" }, { field: "y" }, {
        source: source,
        line_width: 2
    });

    plot.x_range.callback=new Bokeh.CustomJS({args:{plot:plot},code:"console.log(plot.x_range.start);"});

    // Show the plot, appending it to the end of the current
    // section of the document we are in.
    Bokeh.Plotting.show(plot,document.getElementById("myPlot"));
    </script>
</body>
</html>

这里讨论了问题: https://github.com/bokeh/bokeh/issues/7130

问题的编辑代码中显示的当前正确用法。

从 Bokeh 0.12.11 开始,也可以直接将范围回调定义为 javascript 函数:

plot.x_range.callback=function(){console.log(plot.x_range.start);};