Image not displaying

Community Support
1

Hi, I am trying to display an image like this in jupyterlab where i have enabled output_notebook():

from bokeh.layouts import row
from bokeh.io import show, output_notebook
from bokeh.plotting import figure
from utils import imshow
import numpy as np, pandas as pd, json
from skimage.measure import label, regionprops_table
import cv2
from bokeh.plotting import ColumnDataSource
output_notebook()

ds = ColumnDataSource(data=dict(image=[img])) 
p = figure(x_range=(0, img.shape[1]), y_range=(0, img.shape[0]))
p.image(
    image='image', x=0, y=0, 
    dw=img.shape[1], dh=img.shape[0], 
    palette="Spectral11"
)
show(p)

However when i run the cell no image shows and i the following error in the console:

Uncaught (in promise) TypeError: Cannot read properties of null (reading 'dimension')
    at p._set_data (bokeh-3.0.3.min.js:509:2147)
    at p.set_data (bokeh-3.0.3.min.js:376:4330)
    at R.set_data (bokeh-3.0.3.min.js:372:4143)
    at R.lazy_initialize (bokeh-3.0.3.min.js:372:1824)
    at async a (bokeh-3.0.3.min.js:224:210)
    at async t.build_views (bokeh-3.0.3.min.js:224:625)
    at async _.build_renderer_views (bokeh-3.0.3.min.js:574:10203)
    at async _.lazy_initialize (bokeh-3.0.3.min.js:574:3853)
    at async a (bokeh-3.0.3.min.js:224:210)
    at async t.build_view (bokeh-3.0.3.min.js:224:315)

If i display the image directly (without using columndatasource) it works great.

Why can i not use columndatasource like this?

2

What exactly is img? Your example code leaves that important detail out. It should be a 2d numpy array of numbers.

3

Hi @Bryan, thats exactly what it is. a 2d numpy array of uint8 numbers.

4

@bokehcoder In that case I would need an actual complete Minimal Reproducible Example that I could run myself to reproduce and investigate. Otherwise all I can suggest is to try converting to other dtypes in case perhaps there is some specific issue with uint8.

5

Here is a complete reproducable example:

from bokeh.plotting import ColumnDataSource
from bokeh.io import show, output_notebook
from bokeh.plotting import figure
from utils import imshow
import numpy as np
output_notebook()
img = np.random.rand(10,10)
ds = ColumnDataSource(data=dict(image=[img])) # image=[np.flipud(img)]
p = figure(x_range=(0, img.shape[1]), y_range=(0, img.shape[0]))
p.image(
    image='image', x=0, y=0, 
    dw=img.shape[1], dh=img.shape[0], 
    palette="Spectral11"
)
show(p)

Im running it in a jupyterlab notebook

6

@bokehcoder you have not passed the CDS as the value of the source parameter to p.image

7

ugh yes… ok. Sorry about that mistake.
It works now.

1 Like
8

This topic was automatically closed 90 days after the last reply. New replies are no longer allowed.