Question

我想用日期时间轴和显示数据点日期时间的悬停工具创建多线散景图。这应该得到支持，我已经尝试通过两种方式来获得预期的行为：

使用hover.formatters格式化x值。这对情节没有影响。
添加具有正确格式的日期/时间值的描述变量。这样就产生了一个悬停工具，其中所有日期/时间值都显示在每个点的列表中。

我提供了一个较小的代码示例，用于说明我的方法和结果。它与更新数据的复选框组结合使用。这就是为什么要从数据框中创建新的ColumnDataSource的原因。

import pandas as pd
import numpy as np
from bokeh.io import output_file, show
from bokeh.plotting import figure
from bokeh.models import HoverTool, ColumnDataSource
from bokeh.palettes import Spectral4
from bokeh.layouts import column

#output_file("demo.html")

available_quant = ["LACTIC_ACID", "GLUCOSE", "XYLOSE", "FORMIC_ACID"]
quant_legend = ["Lactic acid", "Glucose", "Xylose", "Formic acid"]

创建一个具有4个数量和时间的数据框

datelist = pd.date_range(end = pd.datetime.today(), periods=100).tolist()
desc = datelist
for i, date in enumerate(datelist):
    desc[i] = str(date)
RT_x = np.linspace(-5, 5, num=100)
lactic = RT_x**2
data = {'time': datelist, 'desc': desc, 'LACTIC_ACID': RT_x**2 + 2, 'GLUCOSE': RT_x**2, 'XYLOSE': RT_x**2 - 2, 'FORMIC_ACID': RT_x**2 - 4}
df = pd.DataFrame.from_dict(data)
df['time'] = pd.to_datetime(df['time'], format = "%Y-%m-%d %H:%M:%S")

将相关数据复制到columndatasource

substance_colors = Spectral4
quant_to_plot = available_quant
xs = []
ys = []
xsprint = []
colors = []
labels = []

for i, substance in enumerate(quant_to_plot):
    xs.append(list(df['time']))
    ys.append(list(df[substance]))
    xsprint.append(list(df['desc']))
    index = available_quant.index(substance)
    colors.append(substance_colors[index])
    labels.append(quant_legend[index])

new_src = ColumnDataSource(data={'x': xs, 'y': ys, 'desc': xsprint, 'color': colors, 'label': labels})

使用hover.formatters制作第一张图

p = figure(plot_width=800, plot_height=400, x_axis_type="datetime", title = 'Demo', x_axis_label = 'Time', y_axis_label = 'c [g/mL]')

p.multi_line('x','y', color = 'color', legend = 'label', source = new_src)

hover = HoverTool(tooltips=[('Type','@label'), 
                            ('Time','$x'), 
                            ('Conc','$y')], 
                  formatters={'Time': 'datetime'}, 
                  mode = 'mouse',
                 line_policy='next')
p.add_tools(hover)
p.legend.location = "top_left"
p.legend.orientation = "horizontal"

使用描述变量制作第二张图

p2 = figure(plot_width=800, plot_height=400, x_axis_type="datetime", title = 'Demo', x_axis_label = 'Time', y_axis_label = 'c [g/mL]')

p2.multi_line('x','y', color = 'color', legend = 'label', source = new_src)

hover = HoverTool(tooltips=[('Type','@label'), 
                            ('Time','@desc'), 
                            ('Conc','$y')], 
                  mode = 'mouse',
                 line_policy='nearest')
p2.add_tools(hover) 

mylayout = column(p, p2)
show(mylayout)

我错过了一些琐碎的事情吗？我正在运行Bokeh 0.13.0和python 3.6.4。

Answer 1

第一种方法适用于hovertool的以下修改：

var clickState={};
    var justClicked=null;
  window.confirm = function(message) {
  var e = window.event || window.confirm.caller.arguments[0];
  var el = e.target || e.srcElement;  // the element's click that triggers confirm dialog
        if(justClicked && clickState[justClicked]===true){
            clickState[justClicked]=false;
            return true;
        }else{
            // your async style confirmation dialog (e.g. jQuery's dialog)
            showConfirmBox(message, function() {
                    justClicked=el;
                    clickState[el]=true;
                    $(justClicked).click();   // in the call back function , click the target again. 
            });
        }
  return false;
  };

具有日期时间轴的bokeh悬停多行

1 个答案: