散景布局的背景颜色

Question

我正在玩弄散景 sliders demo (source code here)，我正在尝试更改整个页面的背景颜色。虽然使用 background_fill_color 和 border_fill_color 可以轻松更改图形的颜色，但布局的其余部分仍然出现在白色背景之上。有没有我可以添加到主题的属性，允许我通过 curdoc().theme 设置颜色？

Answer 1

目前没有任何 Python 属性可以控制 HTML 背景颜色。 HTML 和 CSS 是广阔的领域，因此 Bokeh 没有尝试为每个可能的样式选项制作相应的 Python 属性，而是提供了一种通用机制来提供您自己的 HMTL 模板以便可以应用任何熟悉的标准 CSS。

这最容易通过将 templates/index.html 文件添加到 Directory-style Bokeh App. The template should be Jinja2 template 来实现。在 <head>:

中需要定义两个替换项

{{ bokeh_css }}
{{ bokeh_js }}

以及 <body> 中要求的两个：

{{ plot_div }}
{{ plot_script }}

该应用程序将出现在模板中出现 plot_script 的任何位置。除此之外，您可以应用任何您需要的 HTML 和 CSS。你可以在这里看到一个具体的例子：

https://github.com/bokeh/bokeh/blob/master/examples/app/crossfilter

更改页面背景的简化模板可能如下所示：

<!DOCTYPE html>
<html lang="en">
    <head>
        <style>
            body { background: #2F2F2F; }
        </style>
        <meta charset="utf-8">
        {{ bokeh_css }}
        {{ bokeh_js }}
    </head>
    <body>
        {{ plot_div|indent(8) }}
        {{ plot_script|indent(8) }}
    </body>
</html>

Answer 2

更改 .bk-root 样式对我有用：

from bokeh.resources import Resources
from bokeh.io.state import curstate
from bokeh.io import curdoc, output_file, save
from bokeh.util.browser import view
from bokeh.models.widgets import Panel, Tabs
from bokeh.plotting import figure 

class MyResources(Resources):
    @property
    def css_raw(self):
        return super().css_raw + [
            """.bk-root {
                    background-color: #000000;
                    border-color: #000000;
                    }
            """
        ]

f = figure(height=200, width=200)
f.line([1,2,3], [1,2,3])

tabs = Tabs( tabs=[ Panel( child=f, title="TabTitle" ) ], height=500 )

output_file("BlackBG.html")
curstate().file['resources'] = MyResources(mode='cdn')
save(tabs)
view("./BlackBG.html")

Answer 3

来自Bokeh documentation：

The background fill style is controlled by the background_fill_color and background_fill_alpha properties of the Plot object:
from bokeh.plotting import figure, output_file, show

output_file("background.html")

p = figure(plot_width=400, plot_height=400)
p.background_fill_color = "beige"
p.background_fill_alpha = 0.5

p.circle([1, 2, 3, 4, 5], [2, 5, 8, 2, 7], size=10)

show(p)

Answer 4

如果您使用 row 或 column 在文档中显示多个图形，解决方法是设置 background 属性，如下所示：

curdoc().add_root(row(fig1, fig2, background="beige"))

散景布局的背景颜色

Background color of bokeh layout

python

bokeh