散景标签字体大小响应图形大小

Question

我正在添加标签作为图形的注释。我可以预先设置标签的字体大小。但是调整浏览器大小，只有图形大小有响应，label字体大小没有响应。

fig = figure(x_axis_type='datetime', y_axis_label=labels[i],
             toolbar_location=None, active_drag=None, 
             active_scroll=None)
fig.line(x='time', y='data', source=source, line_color='red')
annotation = Label(x=10, y=10, text='text', text_font_size='60px', text_color='white', x_units='screen', y_units='screen', background_fill_color=None))

我尝试使用图形的高度来调整字体大小，但这不起作用。有没有办法达到这个目的？感谢您的任何 hint/help.

annotation.text_font_size = str(fig.plot_height * 0.1)+'px'

Answer 1

这个问题更多地是关于 css 而不是散景本身。从here开始，字体大小的单位选择范围很广。对于我的情况，'vh' 可以解决问题，字体大小现在可以响应浏览器的尺寸。例如：

annotation = Label(x=10, y=10, text='text', text_font_size=<b><i>'10vh'</i></b>, text_color='white', x_units='screen', y_units='screen', background_fill_color=None))

独立示例：

from bokeh.server.server import Server
from bokeh.models import ColumnDataSource, Label
from bokeh.plotting import figure
from bokeh.layouts import column
import numpy as np
import datetime as dt
from functools import partial
import time

def f_emitter(p=0.1):
    v = np.random.rand()
    return (dt.datetime.now(), 0. if v>p else v)


def make_document(doc, functions, labels):
    def update():
        for index, func in enumerate(functions):
            data = func()
            sources[index].stream(new_data=dict(time=[data[0]], data=[data[1]]), rollover=1000)
            annotations[index].text = f'{data[1]: .3f}'
            # print(figs[index].height)

    sources = [ColumnDataSource(dict(time=[], data=[])) for _ in range(len(functions))]
    figs = []
    annotations = []
    for i in range(len(functions)):
        figs.append(figure(x_axis_type='datetime',
                       y_axis_label=labels[i], toolbar_location=None,
                       active_drag=None, active_scroll=None))
        figs[i].line(x='time', y='data', source=sources[i])
        annotations.append(Label(x=10, y=10, text='', text_font_size='10vh', text_color='black',
                             x_units='screen', y_units='screen', background_fill_color=None))
        figs[i].add_layout(annotations[i])


    doc.add_root(column([fig for fig in figs], sizing_mode='stretch_both'))
    doc.add_periodic_callback(callback=update, period_milliseconds=100)


if __name__ == '__main__':
    # list of functions and labels to feed into the scope
    functions = [f_emitter]
    labels = ['emitter']

    server = Server({'/': partial(make_document, functions=functions, labels=labels)})
    server.start()
    server.io_loop.add_callback(server.show, "/")
    try:
        server.io_loop.start()
    except KeyboardInterrupt:
        print('keyboard interruption')

散景标签字体大小响应图形大小

Bokeh Label font size responsive to figure size

python

responsive-design

bokeh

python-3.7