Javascript 散景 Plot 不在浏览器中呈现

Question

我正在创建 Bokeh Plot，并传递 html 代码script, div = components(plot)

return render_template('results.html',the_div=div,the_script=script)

脚本和 div 已被传递到浏览器，但没有看到 plot，而是显示 html 代码。

{% extends "bootstrap/base.html" %}
{% import "bootstrap/wtf.html" as wtf %}

{% block html_attribs %} lang="en" charset="utf-8"{% endblock %}

{% block title %}  Results {% endblock %}
{% block metas %}
</mysite/static/favicon-96x96.png">
<link rel="stylesheet" href= "https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">

<script src="https://cdn.bokeh.org/bokeh/release/bokeh-2.0.2.min.js"
        crossorigin="anonymous"></script>
<script src="https://cdn.bokeh.org/bokeh/release/bokeh-widgets-2.0.2.min.js"
        crossorigin="anonymous"></script>
<script src="https://cdn.bokeh.org/bokeh/release/bokeh-tables-2.0.2.min.js"
        crossorigin="anonymous"></script>


{% endblock %}

{% block content %}

<div class="container">
        {{ the_script }}
        {{ the_div }}
</div>

有人可以指出我哪里出错了吗？ - 我检查了我使用的散景版本是 2.0.2 我不熟悉 javascript 所以我假设它可能是一个简单的修复

浏览器控制台的视图：

Answer 1

默认情况下，所有模板参数都被转义以防止它们改变 DOM 结构。 由于您确实需要更改 DOM 结构，因此您只需将|save添加到每个变量：

{{ the_script|safe }}
{{ the_div|safe }}

更多详细信息： https://jinja.palletsprojects.com/en/2.11.x/templates/#working-with-automatic-escaping

Answer 2

您的控制台屏幕截图显示了问题。 您正在尝试从 CDN 加载使用 Python Bokeh 版本 1.3.4 和 BokehJS 版本 2.0.2 生成的 Bokeh JSON。 这不受支持且不起作用（版本必须匹配）。