How to add text to html files generated by Python Bokeh
There are many ways to embed bokeh graphics in other documents. For static documents, you can create your own default Bokeh document, or you can use the template that you provide. You can also generate just
and tags and
then embed them in your own static pages or web applications as you like. Any of the above can also contain data in a document, in a sidecar file,
or downloaded from a Bokeh server. All of these parameters are described in the Implementation User Guide section:
and in the reference manual:
Please let us know if there is more or more detailed information that we could add there.
source to share
I wanted to add description to my plots so that people can understand some complex and subject-specific terms, and embedding plots / data in HTML documents seemed difficult.
I found something called markup widgets that is very easy to understand and implement. If all you want to add to the graph is plain text, continue with that.
The documentation says that
The explicit purpose of these Bokeh models is to embed raw HTML text for browser execution. If any piece of text comes from untrusted user input, you should take care to sanitize the user input before passing it to Bokeh.
Copying examples from the above link for quick reference and in case the link doesn't work.
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))
source to share