Run sample code find: Error: reference {"type":"ColumnDataSource",}

Hi,

When a implemented my code based on follow sample code, I got a error of:

Uncaught Error: reference {“type”:“ColumnDataSource”,“id”:“5c356b74-1e46-4e92-bd35-c0bd7ff9c4c1”} isn’t known (not in Document?)

at o (document.js:412)

at document.js:433

at o (document.js:417)

at Function.P._resolve_refs (document.js:437)

at P.apply_json_patch (document.js:728)

at t._handle_patch (session.js:70)

at t.handle (session.js:19)

at t._steady_state_handler (connection.js:262)

at t.ACK.t.msgtype._current_handler (connection.js:242)

at t._on_message (connection.js:204)

But when I just copied and run the sample code only with bokeh serve mode, I found this error as well. Is anyone know why? Is there any error in our bokeh sample? My bokeh version is 0.13.0. This code is OK on jupyter.

from bokeh.plotting import figure, output_file, show
from bokeh.models import ColumnDataSource, HoverTool, CustomJS

output_file("hover_callback.html")

# define some points and a little graph between them
x = [2, 3, 5, 6, 8, 7]
y = [6, 4, 3, 8, 7, 5]
links = {
    0: [1, 2],
    1: [0, 3, 4],
    2: [0, 5],
    3: [1, 4],
    4: [1, 3],
    5: [2, 3, 4]
}

p = figure(plot_width=400, plot_height=400, tools="", toolbar_location=None, title='Hover over points')

source = ColumnDataSource({'x0': [], 'y0': [], 'x1': [], 'y1': []})
sr = p.segment(x0='x0', y0='y0', x1='x1', y1='y1', color='olive', alpha=0.6, line_width=3, source=source, )
cr = p.circle(x, y, color='olive', size=30, alpha=0.4, hover_color='olive', hover_alpha=1.0)

# Add a hover tool, that sets the link data for a hovered circle
code = """
var links = %s;
var data = {'x0': [], 'y0': [], 'x1': [], 'y1': []};
var cdata = circle.data;
var indices = cb_data.index['1d'].indices;
for (var i = 0; i < indices.length; i++) {
    var ind0 = indices[i]
    for (var j = 0; j < links[ind0].length; j++) {
        var ind1 = links[ind0][j];
        data['x0'].push(cdata.x[ind0]);
        data['y0'].push(cdata.y[ind0]);
        data['x1'].push(cdata.x[ind1]);
        data['y1'].push(cdata.y[ind1]);
    }
}
segment.data = data;
""" % links

callback = CustomJS(args={'circle': cr.data_source, 'segment': sr.data_source}, code=code)
p.add_tools(HoverTool(tooltips=None, callback=callback, renderers=[cr]))

show(p)

Hi,

You are never adding any roots to your document. Every Bokeh server app typically ends with a line similar to

    cursor().add_root(...)

which specifies what the Bokeh server should display. The "show" function is only useful for standalone (i.e. non Bokeh server) content. There are lots of example apps you can refer to here:

  https://github.com/bokeh/bokeh/tree/master/examples/app

As well as documentation about the Bokeh server and Bokeh apps here:

  https://bokeh.pydata.org/en/latest/docs/user_guide/server.html

Thanks,

Bryan

···

On Dec 13, 2018, at 00:41, yolanda chen <[email protected]> wrote:

Hi,

When a implemented my code based on follow sample code, I got a error of:

Uncaught Error: reference {"type":"ColumnDataSource","id":"5c356b74-1e46-4e92-bd35-c0bd7ff9c4c1"} isn't known (not in Document?)
    at o (document.js:412)
    at document.js:433
    at o (document.js:417)
    at Function.P._resolve_refs (document.js:437)
    at P.apply_json_patch (document.js:728)
    at t._handle_patch (session.js:70)
    at t.handle (session.js:19)
    at t._steady_state_handler (connection.js:262)
    at t.ACK.t.msgtype._current_handler (connection.js:242)
    at t._on_message (connection.js:204)

But when I just copied and run the sample code only with bokeh serve mode, I found this error as well. Is anyone know why? Is there any error in our bokeh sample? My bokeh version is 0.13.0. This code is OK on jupyter.

from bokeh.plotting import figure, output_file, show
from bokeh.models import ColumnDataSource, HoverTool, CustomJS

output_file("hover_callback.html")

# define some points and a little graph between them
x = [2, 3, 5, 6, 8, 7]
y = [6, 4, 3, 8, 7, 5]
links = {

0: [1, 2],

1: [0, 3, 4],

2: [0, 5],

3: [1, 4],

4: [1, 3],

5: [2, 3, 4]
}

p = figure(plot_width=400, plot_height=400, tools="", toolbar_location=None, title='Hover over points')

source = ColumnDataSource({'x0': , 'y0': , 'x1': , 'y1': })
sr = p.segment(x0='x0', y0='y0', x1='x1', y1='y1', color='olive', alpha=0.6, line_width=3, source=source, )
cr = p.circle(x, y, color='olive', size=30, alpha=0.4, hover_color='olive', hover_alpha=1.0)

# Add a hover tool, that sets the link data for a hovered circle
code = """
var links = %s;
var data = {'x0': , 'y0': , 'x1': , 'y1': };
var cdata = circle.data;
var indices = cb_data.index['1d'].indices;
for (var i = 0; i < indices.length; i++) {
    var ind0 = indices[i]
    for (var j = 0; j < links[ind0].length; j++) {
        var ind1 = links[ind0][j];
        data['x0'].push(cdata.x[ind0]);
        data['y0'].push(cdata.y[ind0]);
        data['x1'].push(cdata.x[ind1]);
        data['y1'].push(cdata.y[ind1]);
    }
}
segment.data = data;
""" % links

callback = CustomJS(args={'circle': cr.data_source, 'segment': sr.data_source}, code=code)
p.add_tools(HoverTool(tooltips=None, callback=callback, renderers=[cr]))

show(p)

--
You received this message because you are subscribed to the Google Groups "Bokeh Discussion - Public" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [email protected].
To post to this group, send email to [email protected].
To view this discussion on the web visit https://groups.google.com/a/continuum.io/d/msgid/bokeh/dd53b6d8-edad-4d9e-a641-403630581d00%40continuum.io.
For more options, visit https://groups.google.com/a/continuum.io/d/optout.