HTMLlabel text not rendering

[alustig3]

I am trying to use HTMLLabel. I was expecting that if using html tags in the text string, that the text would be rendered according to the tags. When I tried (basic example below), the tags are shown as if they are part of the string, and the label style does not render according to the tags.

from bokeh.plotting import figure, show
from bokeh.models import HTMLLabel

p = figure(width=400, height=400)
label = HTMLLabel(x=220,y=200,x_units='canvas',y_units='canvas',text="<h1>header 1</h1>")
p.add_layout(label)
label = HTMLLabel(x=200,y=100,x_units='canvas',y_units='canvas',text="<h3>header 3</h3>")
p.add_layout(label)

show(p)

the following is my bokeh info results

Python version      :  3.10.0 (default, Nov 14 2021, 21:28:14) [Clang 11.0.3 (clang-1103.0.32.62)]
IPython version     :  8.15.0
Tornado version     :  6.3.3
Bokeh version       :  3.3.0
BokehJS static path :  /Users/lustiga/.local/share/virtualenvs/pyControl_official-H2ResLOC/lib/python3.10/site-packages/bokeh/server/static
node.js version     :  v20.1.0
npm version         :  9.6.4
Operating system    :  macOS-10.16-x86_64-i386-64bit

[Chaitanya]

Hey,

I believe the text property of HTMLLabel class is taken as a string directly. The text is not parsed. You can control font sizes by using the text property text_font_size.

You can refer to ScalarTextProps in bokeh.core.property_mixins — Bokeh 3.3.0 Documentation to have an idea about various text properties.

Thanks

[alustig3]

What is the difference between HTMLLabel and Label then?

[Bryan]

Label is rendered directly on an HTML canvas using basic canvas text drawing primitives, HTMLLabel is renderer as textContent using an absolutely positioned div on top of the canvas. This dichotomy is an implementation detail poking through, more or less (rendering to the canvas may be too slow for highly interactive things since it requires a full canvas re-draw).

cc @mateusz for any additional context or comments on future plans for the API.