Import and paste images onto a plot from links listed in a csv

Community Support
1

Hello!

I was wondering if there is a way to include (place/paste?) images onto a bokeh plot - when the urls to images are in a .csv file?
That works easily for a hover tool but for some reason I am unable to do it on the plot directly.
I have tried p.image_url or div.

(let me know if I did not explain myself well)

Thanks in advance
Niko

2

image_url or putting things in a Div should work, depending on what you actually want to do. But it 's not really possible to speculate without actual code. We always recommend providing a Minimal Reproducible Example so that there is no confusion or back-and-forth questions about what exactly is happening.

2 Likes
3

Hi, @Bryan

yes, you are correct, it makes more sense if I have a code example.

Here it is:

import pandas as pd
from bokeh.plotting import figure, show
from bokeh.io import output_file, show
from bokeh.transform import dodge, factor_cmap

input_file = pd.read_csv (r'data.csv')
output_file("output.html", mode="inline")

df = pd.DataFrame(input_file)

cols = [str(x) for x in range(1, 4)]
rows = [str(x) for x in range(1, 4)]

p = figure(title='example', plot_width=700, plot_height=600,
           x_range=cols, y_range=list(reversed(rows)))

r = p.rect('cols', 'rows', 0.95, 0.95, source=df, fill_alpha=0.8,  
           color='blue')

text_props = {'source': df, 'text_align': 'center', 'text_baseline': 'middle'}

x = dodge('cols', 0, range=p.x_range)

p.image_url(x=x, y=dodge('rows', -0.3, range=p.y_range), url=["urls"], anchor='bottom_left', w=0.1, h=0.1)

p.text(x=x, y=dodge('rows', -0.3, range=p.y_range), text='param',
       text_font_size="15px", text_color='white', **text_props)

p.outline_line_color = None
p.grid.grid_line_color = None
p.axis.axis_line_color = None
p.axis.major_tick_line_color = None
p.axis.major_label_standoff = 0
p.xaxis.visible = False
p.yaxis.visible = False
p.title.text_font_size = '20pt'

show(p)

the input file has column headers ā€œparamā€, ā€˜urlā€™ and so on.

The main idea: assign an image to each corresponding cell (plot it in the cell). The links to the images are stored in the csv file.

Thanks in advance
niko

4

If you want to reference columns named "rows" and "cols" then you need to add those columns (with those name) in the DataFrame, since it doesnā€™t sound like it has them. But here I can only speculateā€¦ generally any necessary sample or synthetic data necessary to actually run the code should be included with the MRE.