Created
May 4, 2016 12:11
-
-
Save mattpap/eb15e406be17de249a8b7b6e30cf93ab to your computer and use it in GitHub Desktop.
Show how to connect two bokeh plots with hover tool
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import numpy as np | |
from bokeh.plotting import figure, hplot, show, output_file | |
from bokeh.models import HoverTool, CustomJS, ColumnDataSource | |
N = 20 | |
x = np.random.random(size=N) | |
y = np.random.random(size=N) | |
p = figure(tools=["hover"], toolbar_location=None) | |
p.scatter(x, y, size=10) | |
img_x = np.linspace(0, 10, N) | |
img_y = np.linspace(0, 10, N) | |
images = [] | |
for a, b in zip(x, y): | |
xx, yy = np.meshgrid(x, y) | |
d = np.sin(a*xx)*np.cos(b*yy) | |
images.append(d) | |
imgs_source = ColumnDataSource(data=dict(images=images)) | |
img_source = ColumnDataSource(data=dict(image=[])) | |
img = figure(x_range=(0, 10), y_range=(0, 10), tools=[], toolbar_location=None) | |
img.image(image="image", x=0, y=0, dw=10, dh=10, source=img_source, palette="Greys7") | |
hover = p.select_one(HoverTool) | |
hover.callback = CustomJS(args=dict(imgs_source=imgs_source, img_source=img_source), code=""" | |
var indices = cb_data.index['1d'].indices; | |
if (indices.length > 0) { | |
var img = imgs_source.data.images[indices[0]]; | |
img_source.data = {image: [img]}; | |
} else { | |
img_source.data = {image: []}; | |
} | |
""") | |
hover.tooltips = None | |
output_file("linked_hover.html") | |
show(hplot(p, img)) |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
This looks really useful for something I am trying to build, but I am having trouble getting this to run.
hplot
is deprecated and replaced withbokeh.layouts.row
- changing that will get the plot to load, but the interactivity is not happening. Any ideas?