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.