Pydeck/DeckGL map is not working with H3 Hexagon Layer

[spkompella]

Panel deckGL pane is unable to render H3 Hexagon Layers. I created a H3 Hexagon Map using Pydeck and was able to render the map to HTML. However, after passing the pydeck object to the Panel DeckGL Pane, the map that was rendered was broken.

Tested with Panel 0.12.6

[jbednar]

Can you provide example code that reproduces the problem?

[spkompella]

Sure! Here is the H3HexagonLayer example from Pydeck:

"""
H3HexagonLayer
==============

Plot of values for a particular hex ID in the H3 geohashing scheme.

This example is adapted from the deck.gl documentation.
"""

import pydeck as pdk
import pandas as pd

H3_HEX_DATA = "https://raw.githubusercontent.com/visgl/deck.gl-data/master/website/sf.h3cells.json"

df = pd.read_json(H3_HEX_DATA)

# Define a layer to display on a map
layer = pdk.Layer(
    "H3HexagonLayer",
    df,
    pickable=True,
    stroked=True,
    filled=True,
    extruded=False,
    get_hexagon="hex",
    get_fill_color="[255 - count, 255, count]",
    get_line_color=[255, 255, 255],
    line_width_min_pixels=2,
)

# Set the viewport location
view_state = pdk.ViewState(latitude=37.7749295, longitude=-122.4194155, zoom=14, bearing=0, pitch=30)

# Render
r = pdk.Deck(layers=[layer], initial_view_state=view_state, tooltip={"text": "Count: {count}"})
r.to_html("h3_hexagon_layer.html")

This produces the correct DeckGL map with hex layer. Running the following however, results in a map that glitches and zooms out:

deckgl_pane = pn.pane.DeckGL(r, height=600)

I also tried the following but it only showed the basemap but not my Hex Layers:

deckgl_pane = pn.pane.DeckGL(r.to_json(), height=600)

[spkompella]

I also tried creating a PolygonLayer instead of the H3HexagonLayer and I was running into the same problem. It seems that creating Polygon Layers on the map is the root cause of the failure when converting to a Panel Pane as the H3HexagonLayer is a composite layer that also generates a PolygonLayer