8

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

4

3 回答 3

2

有很多方法可以将散景图嵌入到其他文档中。对于静态文档，您可以让 Bokeh 创建其标准默认文档，也可以让它使用您提供的模板。您也可以只生成divandscript标记，然后将它们嵌入到您自己的静态页面或网络应用程序中，但您喜欢。上述任何一项也可以将数据包含在文档中、sidecar.js文件中或从 Bokeh 服务器加载。所有这些选项都在关于嵌入的用户指南部分中进行了描述：

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

并在参考指南中：

https://docs.bokeh.org/en/latest/docs/reference/resources.html

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

于 2014-11-05T17:30:13.843 回答
2

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

如果您想要添加到图表中的只是一个简单的文本，请继续执行此操作。

文件指出

警告

这些散景模型的明确目的是嵌入原始 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))
于 2019-01-10T16:01:56.147 回答
0

这是一个使用 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)
于 2019-02-28T08:38:57.240 回答