Bokeh Inline Embedding, 'Failed to load resource'

Question

I'm having an issue with embedding Bokeh inline. Particularly, there is an issue with loading the resources from the 'link' tag (refer to html snippet below). For some reason, when I try try to embed a Bokeh plot inline, the following error occurs: 'Failed to load resource: the server responded with a status of 404 (Not Found)', referencing this link - https://cdn.bokeh.org/bokeh/release/bokeh.min.css.map

However, the above address is different from the one I indicate in the link tag (it omits the bokeh version at the end). I have no idea why this error occurs, it's the first time that this happens. I have previously used inline embedding successfully on a number of occasions.

<head>
     <link href="https://cdn.bokeh.org/bokeh/release/bokeh-0.12.1.min.css" rel="stylesheet" type="text/css">
     <script src="https://cdn.bokeh.org/bokeh/release/bokeh-0.12.1.min.js>
     </script>
</head>

EDIT

I am trying to use inline embedding together with jQuery (I would like to display different Bokeh plots without reloading the entire page every time).

When I looked for further error details in the console, I found the following error: "Error rendering Bokeh model: could not find tag with id..."

If it's of any relevance, here is the jQuery script in my html:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<script type=text/javascript>
    $(function() {
      $('a#process_input').bind('click', function() {
        $.getJSON('/background_process', {
          proglang: $('input[name="proglang"]').val(),
        }, function(data) {
          $("#result").html(data.a);
          $("#r").html(data.b);
        });
        return false;
      });
    });
</script>

Where 'data.a' and 'data.b' are the Bokeh-generated script and div tags, respectively.

Any suggestions or advice would be much appreciated!

bigreddot bigreddot · Accepted Answer · 2016-08-27T16:53:49

Best guess is that the script is executing first/early, before the <div> is inserted into the DOM. You will need to find a way to guarantee that the <div> is available by the time the the script executes.

As an aside the partial load use case was not really envisioned when the componenent function was created. If you want to do partial loads, it might be better to serve the doc JSON and then calling Bokeh.embed.embed_items directly on from JavaScript somehow. But it would probably take some experimentation and discussion and back and forth to get that working, which SO is not very good for. I'd encourage you you bring this topic to the public Discourse for further discussion.

Bokeh Inline Embedding, 'Failed to load resource'

1 Answers