Синхронизация всплывающих подсказок на нескольких участках боке - PullRequest
Новая
       18

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

0 голосов
/ 24 июня 2019

Я создал грид-график с использованием боке, состоящего из нескольких вертикально сложенных линейных диаграмм. S enter code here, используя одну и ту же ось X. Мне нужно, чтобы подсказка отображалась на всех диаграммах при наведении курсора на точку на одной из диаграмм.Пробовал несколько способов, но не смог найти решение. Было бы здорово, если бы кто-то там помог мне решить эту проблему. 

from bokeh.palettes import RdBu3, RdYlGn3
from bokeh.plotting import figure, output_notebook, show
from bokeh.io import show
from bokeh.models import ColumnDataSource, BoxAnnotation, Button, HoverTool, Text, Circle
from bokeh.models.callbacks import CustomJS
from bokeh.layouts import column, gridplot
from bokeh.models.widgets import TextInput, Div, Select

output_notebook()

#Main Data Source
source = ColumnDataSource(df)
#Filtering the data source based on some condition
df1 = df[Some_Condition]

#Filtered Data Source
sc = ColumnDataSource(df1)

#Callback to be executed on selecting a value from Select widget
callback_select = CustomJS(args=dict(source=source, sc=sc),code="""
    var indices = [];
    var val = cb_obj.value

    sc.data['xx'] = []
    sc.data['yy'] = []
    sc.data['Date'] = []

    for (var i = 0; i < source.get_length(); i++){
        if (source.data['ZZ'][i] == val){
            sc.data['xx'].push(source.data['xx'][i])
            sc.data['yy'].push(source.data['yy'][i])
            sc.data['Date'].push(source.data['Date'][i])
        } else {

        }
    }
    sc.change.emit();

""")


#Select Widget
select = Select(title="ZZ:", value="Select", options=["Opt1", "Opt2", "Opt3"], callback = callback_select)

#Tooltips to be displayed

TOOLTIPS = [("Value: ", "@{xx}")]
TOOLTIPS1 = [("Value: ", "@{yy}")]

#Tools to be shown on plot    
_tools_to_show = 'box_zoom,pan,save,reset,tap,wheel_zoom,crosshair'

#First Chart
p1 = figure(x_axis_type="datetime", plot_height=200, tools = _tools_to_show)

p1.xaxis.visible = False
p1.xgrid.grid_line_color=None
p1.ygrid.grid_line_alpha=0.5
p1.xaxis.axis_label = 'Date'
p1.yaxis.axis_label = 'xx'

#Second Chart
p2 = figure(x_axis_type="datetime", plot_height=200, tools = _tools_to_show)

p2.xgrid.grid_line_color=None
p2.ygrid.grid_line_alpha=0.5
p2.xaxis.axis_label = 'Date'
p2.yaxis.axis_label = 'yy'

#Line charts

c11 = p1.line(x='Date', y='xx', source = sc, color = "green")
c12 = p1.circle(x='Date', y='xx', source = sc)
c21 = p2.line(x='Date', y='yy', source = sc, color = "blue")
c22 = p2.circle(x='Date', y='yy', source = sc)

#Text to be displayed over points on the charts.
visible_text1 = Text(x='Date', y='xx', text='xx', text_color='black', text_alpha=0.5)

visible_text2 = Text(x='Date', y='yy', text='yy', text_color='black', text_alpha=0.5)

#Adding text to the graphs
crt1 = p1.add_glyph(sc, visible_text, selection_glyph=visible_text1)
    crt2 = p2.add_glyph(sc, visible_text2, selection_glyph=visible_text2)


#This piece of code does display multiple tooltips but shows vague behaviour viz. displaying a tooltip where there is no glyph
hover1 = HoverTool(renderers=[c12, c22], tooltips = TOOLTIPS)
hover2 = HoverTool(renderers=[c22, c12], tooltips = TOOLTIPS1)

#Adding hover tools
p1.add_tools(hover1)
p2.add_tools(hover2)

#Creating a grid for plotting
grid = gridplot([select, p1, p2, p3, p4], ncols=1, plot_width=1000, plot_height=1000)

show(grid)

1 Ответ

0 голосов
/ 24 июня 2019

Начиная с Bokeh 1.2, нет хорошего способа сделать это. Существует открытая проблема по этому поводу на GitHub # 1547 - координируйте всплывающие подсказки на нескольких графиках , за которыми вы можете следить за обновлениями или добавлять свой голос.

...