Есть ли способ поместить изображение внутри графика боке, который использует категориальные данные?

Question

Я пытаюсь добавить водяной знак в существующую диаграмму категорий в боке.Я пытался добавить изображение несколькими способами, но пока не смог заставить его работать.

Я пытался использовать категорию (строку) в качестве значения позиции x.Это приводит к исключению WebDriverException:

{"errorMessage": "undefined не является объектом (оценивает 'document.getElementsByClassName (' bk-root ') [0] .children [0] .getBoundingClientRect') " "запрос": { "заголовки": { "Accept": "приложения / JSON", "Accept-Encoding": "идентичность", "Content-Length": "171", "Content-Type":"application / json; charset = UTF-8 "," Host ":" 127.0.0.1:52857","User-Agent":"selenium/3.141.0 (окна Python) "}," httpVersion ":" 1.1 ","method": "POST", "post": "{\" script \ ": \" \ nreturn document.getElementsByClassName ('bk-root') [0] .children [0] .getBoundingClientRect () \ n \ ", \ "args \": [], \ "sessionId \": \ "308a7240-6123-11e9-a877-6d9cf99e3c61 \"} "," url ":" / execute "," urlParsed ": {" anchor ":"", "запрос": "", "файл": "выполнить", "каталог": "/", "путь": "/ выполнить", "относительный": "/ выполнить", "порт": "", "хозяин": "", "пароль": "", "пользователь": "", "USERINFO протокол "", "":": ", "власть"": "", "источник": "/ выполнение"," queryKey ": {}," chunks ": [" execute "]}," urlOriginal ":" / session / 308a7240-6123-11e9-a877-6d9cf99e3c61 / execute "}}

Я также пытался передать категорию в качестве позиции в списке (категория [5]).Это не является ошибкой, но не помещает изображение на график.

# Add watermark
p.image_url(url=[r'static/images/image.png'], x='Mismatch', y=500, w=100, h=100,
                anchor = 'center',
                global_alpha = 0.2)

Ожидаемый результат состоит в том, что изображение появится на моем категориальном графике в желаемой позиции.

Фактический результат заключается в том, что изображение не появляется, или возникает исключение webdriverexception.

Спасибо за вашу помощь!

Answer 1

Вы можете использовать этот обходной путь с Div.Вы можете поместить произвольный HTML-код в Div и расположить этот Div в любом месте экрана, используя встроенные таблицы стилей CSS (Bokeh v1.1.0).

from bokeh.plotting import figure, show
from bokeh.models import CustomJS, Div, Row

p1 = figure(plot_width = 300, plot_height = 300, x_range = (0, 10), y_range = (0, 10), title = "Doggy as background")
p1.line([1, 2, 3, 5, 6, 7, 8, 9, 10], [4, 5, 6, 1, 2, 3, 7, 8, 9, 0], line_width = 5)
url = "https://cdn3.iconfinder.com/data/icons/line/36/dog_head-512.png"
d1 = Div(text = '<div style="position: absolute; left:-300px; top:10px"><img src=' + url + ' style="width:280px; height:280px; opacity: 0.3"></div>')

show(Row(p1, d1))

Результат: