Datashader FigureWidget Compatability

I was using plotly, mapbox, and ipywidgets for an interactive research dashboard with FigureWidget, as described in the documentation. Although I got the visualization working with Figure, I was unable to get it working with FigureWidget due to an error: β€œCan’t clean for JSON: <PIL.Image.Image image mode=RGBA size=50x50 at [memory address]>”.

I moved the notebook into a minimal anaconda jupyterlab environment and had the same issues. I’ve generated a small example to demonstrate the issue that I’m having.

import plotly.graph_objects as go

import pandas as pd

import datashader as ds
import datashader.transfer_functions as tf
data = [{"type":"scattermapbox"
        ,"lat":[39+(50/60)]
        ,"lon":[-98-(35/60)]}]
layout = {"mapbox":{"style":"open-street-map"
                   ,"center":{"lat":39+(50/60),"lon":-98-(35/60)}
                   ,"zoom":5}
         ,"margin":{"r":0,"t":0,"l":0,"b":0}}

fig = go.FigureWidget( data = data, layout = layout )
fig

These cells execute just fine. This demonstrates that there is nothing wrong with FigureWidgets in my environment. Now I generate the datashader tile, per the example in the documentation.

wichita = ( 37+(41/60)+(20/3600), -97-(20/60)-(10/3600) )
lincoln = ( 40+(48/60)+(32/3600), -96-(40/60)-(44/3600) )

sample_df = pd.DataFrame({"lat":[wichita[0],lincoln[0]], "lon":[wichita[1],lincoln[1]]})
test_canvas = ds.Canvas( plot_height = 50, plot_width = 50 )
test_lines = test_canvas.line( sample_df, x = "lat", y = "lon", agg = ds.any() )


coords_lat, coords_lon = test_lines.coords['lat'].values, test_lines.coords['lon'].values
# Corners of the image, which need to be passed to mapbox
coordinates = [[coords_lon[0], coords_lat[0]],
               [coords_lon[-1], coords_lat[0]],
               [coords_lon[-1], coords_lat[-1]],
               [coords_lon[0], coords_lat[-1]]]

test_img = tf.shade( test_lines )[::-1].to_pil()
data = [{"type":"scattermapbox"
        ,"lat":[39+(50/60)]
        ,"lon":[-98-(35/60)]}]
layout = {"mapbox":{"style":"open-street-map"
                   ,"center":{"lat":39+(50/60),"lon":-98-(35/60)}
                   ,"zoom":5
                   ,"layers":[{"sourcetype":"image"
                              ,"source": test_img
                              ,"coordinates": coordinates}]}
         ,"margin":{"r":0,"t":0,"l":0,"b":0}}

fig = go.Figure( data = data, layout = layout )
fig.show()

This code executes as well, showing that the datashader layer works just fine with Figure. The following cell throws an error for me, demonstrating the incompatibility with FigureWidget.

fig_widget = go.FigureWidget( data = data, layout = layout )
fig_widget

Thanks for the help.

1 Like

Should I file this as an issue on GitHub instead? Is it reasonable to assume that the development team intends for Figures and FigureWidgets behave the same with the same input?