在烧瓶中嵌入一个bokeh应用。

时间:2022-01-07 00:35:43

I am trying desperately to embed a working bokeh applet into flask, and can't find a proper way to do this. I looked through all the examples, but I can't find one which includes the ability to update the data (best example: the sliders_applet).

我拼命地想把一个工作的bokeh applet嵌入烧瓶中,却找不到合适的方法来做这件事。我查看了所有的例子,但是我找不到一个包含更新数据的能力(最好的例子:sliders_applet)。

If I'm not mistaken, I do need the bokeh-server to be able to change the data (with sliders etc.). Starting the applet this way works, e.g.:

如果我没有弄错的话,我确实需要bokeh-server来更改数据(使用滑块等)。以这种方式启动应用程序,例如:

bokeh-server --script sliders_app.py

But I can't find the proper, or at least a working way to embed the sliders_app into flask. And since it should be possible to use multiple applets, it doesn't seem clean to me to specify one single applet at the startup of the bokeh server too..

但我找不到合适的,或者至少是一种将sliders_app嵌入烧瓶的工作方式。而且由于应该可以使用多个applet,所以在bokeh服务器的启动时,我也不需要指定一个applet。

I would gladly appreciate any help - bokeh looks like a great tool for me.

我很高兴能得到任何帮助——对我来说,bokeh是一个很好的工具。

2 个解决方案

#1


9  

The other answer does not describe how to embed a Bokeh server app (it uses components to embed a standalone Bokeh document).

另一个答案没有描述如何嵌入一个Bokeh服务器应用程序(它使用组件来嵌入一个独立的Bokeh文档)。

First, you can see lots of live examples hosted at: https://demo.bokehplots.com/

首先,您可以看到许多现场示例:https://demo.bokehplots.com/。

For embedding apps there are two usual options:

对于嵌入应用,有两种常见的选择:

  • iframes (works fine), or
  • iframes(没问题),或
  • autoload_server
  • autoload_server

The latter is usually used like this:

后者通常是这样使用的:

script = autoload_server(model=None,
                         app_path="/apps/slider",
                         url="https://demo.bokehplots.com")

This will return a <script> tag similar to the one below, that you can put in your flask HTML response, wherever you'd like the app to appear:

这将返回一个

<script
    src="https://demo.bokehplots.com/apps/slider/autoload.js?bokeh-autoload-element=c5c9bdb5-40e8-46a2-9bf0-40a9d396ce97"
    id="c5c9bdb5-40e8-46a2-9bf0-40a9d396ce97"
    data-bokeh-model-id=""
    data-bokeh-doc-id=""
></script>

Lastly, it's important to note that by default the Bokeh server opts for a fairly conservative network configuration. You'll need to start the Bokeh server with --allow-websocket-origin command line option set to be whatever host you are embedding the bokeh app into.

最后,需要注意的是,在默认情况下,Bokeh服务器选择了相当保守的网络配置。您将需要启动Bokeh服务器——允许websocket-origin命令行选项设置为您将Bokeh应用程序嵌入到的任何主机。

#2


9  

EDIT by one one of the core developers of the Bokeh project The information below does not answer the question above. It is categorically impossibly to embed a Bokeh Application by using bokeh.embed.components as described below. components is only capable of embedding standalone documenents (i.e. that do NOT run on a Bokeh server)

由Bokeh项目的核心开发者之一编辑,下面的信息没有回答上面的问题。通过使用Bokeh .嵌入式组件来嵌入一个Bokeh应用程序是绝对不可能的。组件只能嵌入独立的文档(即不运行在Bokeh服务器上)


An example of embedding bokeh with flask is present on the bokeh github repo.

在bokeh github repo上有一个嵌入bokeh的例子。

import flask

from bokeh.embed import components
from bokeh.plotting import figure
from bokeh.resources import INLINE
from bokeh.templates import RESOURCES
from bokeh.util.string import encode_utf8

app = flask.Flask(__name__)

colors = {
    'Black': '#000000',
    'Red':   '#FF0000',
    'Green': '#00FF00',
    'Blue':  '#0000FF',
}


def getitem(obj, item, default):
    if item not in obj:
        return default
    else:
        return obj[item]


@app.route("/")
def polynomial():
    """ Very simple embedding of a polynomial chart"""
    # Grab the inputs arguments from the URL
    # This is automated by the button
    args = flask.request.args

    # Get all the form arguments in the url with defaults
    color = colors[getitem(args, 'color', 'Black')]
    _from = int(getitem(args, '_from', 0))
    to = int(getitem(args, 'to', 10))

    # Create a polynomial line graph
    x = list(range(_from, to + 1))
    fig = figure(title="Polynomial")
    fig.line(x, [i ** 2 for i in x], color=color, line_width=2)

    # Configure resources to include BokehJS inline in the document.
    # For more details see:
    #   http://bokeh.pydata.org/en/latest/docs/reference/resources_embedding.html#module-bokeh.resources
    plot_resources = RESOURCES.render(
        js_raw=INLINE.js_raw,
        css_raw=INLINE.css_raw,
        js_files=INLINE.js_files,
        css_files=INLINE.css_files,
    )

    # For more details see:
    #   http://bokeh.pydata.org/en/latest/docs/user_guide/embedding.html#components
    script, div = components(fig, INLINE)
    html = flask.render_template(
        'embed.html',
        plot_script=script, plot_div=div, plot_resources=plot_resources,
        color=color, _from=_from, to=to
    )
    return encode_utf8(html)


def main():
    app.debug = True
    app.run()

if __name__ == "__main__":
    main()

Another idea would be to run bokeh-server and your flask web app side-by-side, and load the bokeh-code that way (server-side or via JS or an iframe), but that could be troublesome.

另一个想法是运行bokeh-server和您的flask web应用程序,并以这种方式加载bokeh代码(服务器端或通过JS或iframe),但这可能会很麻烦。

#1


9  

The other answer does not describe how to embed a Bokeh server app (it uses components to embed a standalone Bokeh document).

另一个答案没有描述如何嵌入一个Bokeh服务器应用程序(它使用组件来嵌入一个独立的Bokeh文档)。

First, you can see lots of live examples hosted at: https://demo.bokehplots.com/

首先,您可以看到许多现场示例:https://demo.bokehplots.com/。

For embedding apps there are two usual options:

对于嵌入应用,有两种常见的选择:

  • iframes (works fine), or
  • iframes(没问题),或
  • autoload_server
  • autoload_server

The latter is usually used like this:

后者通常是这样使用的:

script = autoload_server(model=None,
                         app_path="/apps/slider",
                         url="https://demo.bokehplots.com")

This will return a <script> tag similar to the one below, that you can put in your flask HTML response, wherever you'd like the app to appear:

这将返回一个

<script
    src="https://demo.bokehplots.com/apps/slider/autoload.js?bokeh-autoload-element=c5c9bdb5-40e8-46a2-9bf0-40a9d396ce97"
    id="c5c9bdb5-40e8-46a2-9bf0-40a9d396ce97"
    data-bokeh-model-id=""
    data-bokeh-doc-id=""
></script>

Lastly, it's important to note that by default the Bokeh server opts for a fairly conservative network configuration. You'll need to start the Bokeh server with --allow-websocket-origin command line option set to be whatever host you are embedding the bokeh app into.

最后,需要注意的是,在默认情况下,Bokeh服务器选择了相当保守的网络配置。您将需要启动Bokeh服务器——允许websocket-origin命令行选项设置为您将Bokeh应用程序嵌入到的任何主机。

#2


9  

EDIT by one one of the core developers of the Bokeh project The information below does not answer the question above. It is categorically impossibly to embed a Bokeh Application by using bokeh.embed.components as described below. components is only capable of embedding standalone documenents (i.e. that do NOT run on a Bokeh server)

由Bokeh项目的核心开发者之一编辑,下面的信息没有回答上面的问题。通过使用Bokeh .嵌入式组件来嵌入一个Bokeh应用程序是绝对不可能的。组件只能嵌入独立的文档(即不运行在Bokeh服务器上)


An example of embedding bokeh with flask is present on the bokeh github repo.

在bokeh github repo上有一个嵌入bokeh的例子。

import flask

from bokeh.embed import components
from bokeh.plotting import figure
from bokeh.resources import INLINE
from bokeh.templates import RESOURCES
from bokeh.util.string import encode_utf8

app = flask.Flask(__name__)

colors = {
    'Black': '#000000',
    'Red':   '#FF0000',
    'Green': '#00FF00',
    'Blue':  '#0000FF',
}


def getitem(obj, item, default):
    if item not in obj:
        return default
    else:
        return obj[item]


@app.route("/")
def polynomial():
    """ Very simple embedding of a polynomial chart"""
    # Grab the inputs arguments from the URL
    # This is automated by the button
    args = flask.request.args

    # Get all the form arguments in the url with defaults
    color = colors[getitem(args, 'color', 'Black')]
    _from = int(getitem(args, '_from', 0))
    to = int(getitem(args, 'to', 10))

    # Create a polynomial line graph
    x = list(range(_from, to + 1))
    fig = figure(title="Polynomial")
    fig.line(x, [i ** 2 for i in x], color=color, line_width=2)

    # Configure resources to include BokehJS inline in the document.
    # For more details see:
    #   http://bokeh.pydata.org/en/latest/docs/reference/resources_embedding.html#module-bokeh.resources
    plot_resources = RESOURCES.render(
        js_raw=INLINE.js_raw,
        css_raw=INLINE.css_raw,
        js_files=INLINE.js_files,
        css_files=INLINE.css_files,
    )

    # For more details see:
    #   http://bokeh.pydata.org/en/latest/docs/user_guide/embedding.html#components
    script, div = components(fig, INLINE)
    html = flask.render_template(
        'embed.html',
        plot_script=script, plot_div=div, plot_resources=plot_resources,
        color=color, _from=_from, to=to
    )
    return encode_utf8(html)


def main():
    app.debug = True
    app.run()

if __name__ == "__main__":
    main()

Another idea would be to run bokeh-server and your flask web app side-by-side, and load the bokeh-code that way (server-side or via JS or an iframe), but that could be troublesome.

另一个想法是运行bokeh-server和您的flask web应用程序,并以这种方式加载bokeh代码(服务器端或通过JS或iframe),但这可能会很麻烦。