Embed Bokeh Server App in Django Templating System

Community Support
1

Hello,

i am working on embedding a bokeh app in a Django Webpage and have the
example running, but i am not sure how to layout the app now that it is served in the Django page.

From my perspective there could be two possibilities:

  1. Embed the script tag rendered by server_document() in the Django template and apply a template to the Bokeh app itself. Ideally this should be the custom bootstrap layout I have used in the original Bokeh folder app ( with separate template folder). Are there any hints on how to apply a custom template as setting doc.template= """ ... """ has no effect for me and the Django site just bunches up all root elements?

  2. Embed single divs/plots similar to the Jinja2 {{embed(roots.x)}}. Of course this would be my preferred way but as the server_document() yields a script tag only, I don’t see where I can get the individual models. I looked into the source code to find the AUTOLOAD_REQUEST_TAG which judging from documentation should allow to request a single model:

AUTOLOAD_REQUEST_TAG`  *= <Template 'autoload_request_tag.html'>*

Renders  `<script>`  tags that automatically load BokehJS (if necessary) and then renders a Bokeh model or document. The document may be specified as either an embedded doc ID or a server session ID. If a specific model ID is not specified, the entire document will be rendered.

Parameters

* **src_path**  ([ *str* ]
* **elementid**  ([ *str* ]
* **modelid**  ([ *str* ]
* **docid**  ([ *str* ]
* **headers**  ([ *dict* ]

but the html code does not seem to use the model_id:

<script id="{{ elementid }}">
  var xhr = new XMLHttpRequest()
  xhr.responseType = 'blob';
  xhr.open('GET', "{{ src_path }}", true);
  {% for header, value in headers.items() %}
  xhr.setRequestHeader("{{ header }}", "{{ value }}")
  {% endfor %}
  xhr.onload = function (event) {
    var script = document.createElement('script'),
    src = URL.createObjectURL(event.target.response);
    script.src = src;
    document.body.appendChild(script);
  };
xhr.send();
</script>

Am I missing something here?

TLDR: What is the preferred way to layout a Bokeh server app inside a Django site if the included bokeh Layouts/Rows/Columns are not applicable?

Thanks a lot!