Question

如何为散景生成的绘图添加HTML文件的文本。我没有看到任何用于在文件上专门编写文本的API。你所能做的只是制作情节。

Answer 1

有很多方法可以在其他文档中嵌入Bokeh图。对于静态文档，您可以让Bokeh创建其标准默认文档，或者您可以使用您提供的模板。您还可以生成div和script标记，然后将这些标记嵌入到您自己的静态网页或网络应用中。上述任何一个也可以包含文档中的数据，sidecar .js文件中的数据，或者从Bokeh服务器加载。有关嵌入的用户指南部分介绍了所有这些选项：

http://bokeh.pydata.org/en/latest/docs/user_guide/embed.html

并在参考指南中：

http://bokeh.pydata.org/docs/reference/resources_embedding.html

如果我们可以添加更多或更好的信息，请告诉我们。

Answer 2

我想在图形中添加一些描述，以便人们可以理解一些复杂且特定于领域的术语，并且将图/数据嵌入到HTML文档中似乎很复杂。

我发现了一个叫做markup widgets的东西，它很容易理解和实现。 如果要添加到图形中的只是一个简单的文本，请继续执行此操作。

文档指出

警告

这些Bokeh模型的明确目的是嵌入原始HTML文本供浏览器执行。如果文本的任何部分来自不受信任的用户输入，那么在传递给Bokeh之前，您必须采取适当的措施来清理用户输入。

从上面的链接复制示例以供快速参考，以防链接损坏。


    from bokeh.io import output_file, show
    from bokeh.layouts import widgetbox
    from bokeh.models.widgets import Div
    from bokeh.models.widgets import Paragraph
    from bokeh.models.widgets import PreText

    output_file("div.html")

    pre = PreText(text="""Your text is initialized with the 'text' argument. The remaining Paragraph arguments are 'width' and 'height'.""",width=500, height=100)

    p = Paragraph(text="""Your text is initialized with the 'text' argument. The remaining Paragraph arguments are 'width' and 'height'""", width=200, height=100)

    div = Div(text="""Your <a href="https://en.wikipedia.org/wiki/HTML">HTML</a>-supported text is initialized with the <b>text</b> argument.  The remaining div arguments are <b>width</b> and <b>height</b>. For this example, those values are <i>200</i> and <i>100</i> respectively.""", width=200, height=100)

    show(widgetbox(pre, p, div))

Answer 3

这里是一个使用panads DataFrame和Bokeh Plot生成单个HTML文件的示例。（灵感来自https://github.com/bokeh/bokeh/blob/master/examples/embed/embed_multiple.py）

import io
import pandas as pd
from bokeh.embed import components
from bokeh.models import HoverTool
from bokeh.models import LinearAxis, Range1d
from bokeh.plotting import figure
from bokeh.resources import CDN
from jinja2 import Template


template = Template(
    '''<!DOCTYPE html>
        <html lang="en">
            <head>
                <meta charset="utf-8">
                <title>Overview</title>
                {{ resources }}
                {{ script }}
                <style>
                    .embed-wrapper {
                        display: flex;
                        justify-content: space-evenly;
                    }
                </style>
            </head>
            <body>
                <div>
                    {{ table }}
                </div>                    
                <div class="embed-wrapper">
                    {{ div }}
                </div>
            </body>
        </html>
        ''')

df: pd.DataFrame = get_data_frame()
table_html = df.to_html()

plot = figure(x_axis_label='time', y_axis_label='value', x_axis_type='datetime',
                plot_width=1600, plot_height=800,
                tools='pan,wheel_zoom,zoom_in,zoom_out,box_zoom,reset,save,hover,tap')
plot.sizing_mode = 'scale_width'
# now continue setup your plot 
# ...
#

# get bokeh parts
script_bokeh, div_bokeh = components(plot)
resources_bokeh = CDN.render()

# render everything together
html = template.render(resources=resources_bokeh,
                       script=script_bokeh,
                       table=table_html,
                       div=div_bokeh)

# save to file
out_file_path = "test.html"
with io.open(out_file_path, mode='w') as f:
    f.write(html)

如何将文本添加到Python Bokeh生成的html文件中

3 个答案: