2015-09-04 4 views
3

Мои подсказки на моем участке слишком велики и переполняют сюжет, поскольку строки, которые они отображают, длинны. Я просматривал источник (и немного javascript), но нигде не нашел, что могло бы позволить мне установить шрифт без, вращающий собственный HTML или JavaScript (т. Е. Через некоторый объект Python). Я также попытался наивно добавить <br> и \n символов в строку подсказки, но это не сработало.Bokeh HoverTool пользовательский шрифт и символы перевода строки из Python

Как я могу легко изменить шрифты подсказок (или, возможно, другие соответствующие атрибуты)?

Обновление: Я попытался установить шрифт маленьким, но мне все еще не удается получить символы новой строки во всплывающей подсказке. Вот моя подсказка код:

hover.tooltips = """ y: $y <br> date: @dates <br> items: <br><font face="Arial" size="1">@items</font> """

Проблема есть, каждый элемент из items источника является списком переменной длины, и я хочу, чтобы отделить каждую запись в списке с символом новой строкой, вынесенной в подсказке

Example screenshot

ответ

1

После многократного копания это казалось невозможным с текущей версией Bokeh без редактирования некоторых исходных текстов.

я смог достичь эффекта новой строки, изменив способ bokeh.js разбирает Струну

в моем ColumnDataSource с аргументом ключевого слова items = [['point0item0<br>', 'point0item1<br>'],['point1item1<br>', ...], ...]

Я изменил разбор всплывающих подсказок сбора (не работает на сырье строка подсказки) в bokeh.js так, что он будет уважать <br> элементы в строках она предоставляет путем изменения кода от

value = Util.replace_placeholders(value, ds, i, vars); 
td.append($('<span>').html(value)); 

к

value = Util.replace_placeholders(value, ds, i, vars); 
value = value.replace(/,/g, ""); 
value = value.replace(/&lt;/g, "<"); 
value = value.replace(/&gt;/g, ">"); 
td.append($('<span>').html(value)); 

Я не проверял это вне моего примера, и я вряд ли когда-либо писать JavaScript, так что пользователь берегись. Я также заметил, что звонок .html(value) изменился с .text(value) между версией Боке (0.9.2) и (0.9.3), так что любой HTML-код в строке значения будет соблюден, но <br> уже закодированы (в моем уме, «сломана»;) по Util.replace_placeholders()

В Python, установка подсказки выглядит следующим образом:

hover.tooltips=[ 
     ("grade", "$y"), 
     ("date", "@dates"), 
     ("items", "@items"), 
    ] 

Скриншот парит над одной и той же точки данных теперь выглядит следующим образом

four strings separated by HTML newlines

3

Вы можете использовать custom tooltip, что должно позволить вам делать то, что вам нужно.

На данный момент, вы, вероятно, есть что-то вроде:

hover.tooltips = [ 
    ("index", "$index"), 
    ("foo", "@foo"), 
    ("bar", "@bar"), 
] 

Try:

hover.tooltips = """ 
    The index of my data is: $index <br> 
    My foo property is bold <strong>@foo</strong> 
    I could use a custom font <font face="Arial" size="3">@bar </font> 
""" 

Вы можете увидеть примеры в документации ссылку выше и несколько примеров, которые находятся в боке репо:

https://github.com/bokeh/bokeh/blob/master/examples/interactions/us_marriages_divorces/us_marriages_divorces_interactive.py#L64

https://github.com/bokeh/bokeh/blob/master/examples/glyphs/sprint.py#L90

+0

Спасибо, +1, я видел эти примеры, однако я надеялся избежать писать свой собственный HTML (я понял, сказал JS в вопросе - - моя вина). Нет ли объекта Python, где сохраняются некоторые атрибуты шрифта по умолчанию, и что я могу изменить? – eqzx

+0

Нет, боюсь, что вам нужно будет написать свой собственный HTML-код. – birdsarah

+2

Если 'bar' - это список нескольких элементов, есть ли способ, с помощью которого всплывающая подсказка может иметь новые строки для каждого элемента? – eqzx

Смежные вопросы