Multiple linked plots

[kylebarron]

Seen in https://github.com/movingpandas/movingpandas

Screen.Recording.2024-09-19.at.9.56.51.AM.mov

Should be possible by implementing an on_view_state_change handler.

We should ensure that we're only sending events back from JS to Python if the user has set an on_view_state_change handler

[ATL2001]

Hey @kylebarron I'm actually doing this with lonboard already as it is! no changes needed! check it out

import geopandas as gpd
import lonboard
from lonboard import Map, ScatterplotLayer
import panel as pn
import ipywidgets

pn.extension("ipywidgets")
@pn.cache
def get_data():
    return gpd.read_file(r"C:\temp\ne_110m_populated_places\ne_110m_populated_places.shp")
gdf = get_data()


## make a map
layer = ScatterplotLayer.from_geopandas(gdf, radius_min_pixels=2, get_fill_color="red")
cities_map1 = Map(layer)
cities_map1.layout.height = cities_map1.layout.width = "100%"

## make another map
layer2 = ScatterplotLayer.from_geopandas(gdf, radius_min_pixels=2, get_fill_color="blue")
cities_map2 = Map(layer2)
cities_map2.layout.height = cities_map2.layout.width = "100%"

## make a function to sync map1 to map2 and vice versa
def sync_map1_to_2(x=None):
    if isinstance(x["new"], lonboard.models.ViewState):
        cities_map2.view_state = cities_map1.view_state

def sync_map2_to_1(x=None):
    if isinstance(x["new"], lonboard.models.ViewState):
        cities_map1.view_state = cities_map2.view_state

## have map1 observe the the function to sync to map2
cities_map1.observe(sync_map1_to_2)
## have map2 observe the the function to sync to map1
cities_map2.observe(sync_map2_to_1)

pn.Column(
    "# Lonboard Map",
    pn.pane.IPyWidget(cities_map1, height=500, width=1000),        
    pn.pane.IPyWidget(cities_map2, height=500, width=1000),       
).servable()

[kylebarron]

That's awesome! We should probably put this into an example

[ATL2001]

I'm sure I could find time to write a notebook like the other notebooks in the examples section of the documentation if ya'd like

[kylebarron]

A simple example would be great! Though it would be preferable if you could use an ipywidgets.hbox instead of panel to be more general.