Add an gallery example/tutorial for interactive data visualization using Panel? #2455
Description
The EGU22 PyGMT short course provides an example showing how to use Panel for interactive data visualization with PyGMT (https://www.generic-mapping-tools.org/egu22pygmt/ecosystem.html#interactive-data-visualization-with-xarray-panel-and-pygmt).
I just tried it and found it sometimes useful to explore the effects of different GMT parameters (especially before we implement the movie method #1347).
For example, here is an example to show how the azimuth can affect grid shading (modified from https://www.pygmt.org/dev/gallery/images/grdgradient_shading.html):
import numpy as np
import panel as pn
import xarray as xr
import pygmt
pn.extension()
# Make a panel widget for controlling the depth plotted
az_slider = pn.widgets.DiscreteSlider(name='Azimuth', options=list(np.arange(0, 360, 15)), value=0)
grid = pygmt.datasets.load_earth_relief(resolution="03m", region=[35, 50, 35, 45])
@pn.depends(az=az_slider)
def view(az):
fig = pygmt.Figure()
pygmt.makecpt(cmap="terra", series=[-7000, 7000])
shade = pygmt.grdgradient(grid=grid, azimuth=az, normalize="e2")
fig.grdimage(
grid=grid,
shading=shade,
projection="M15c",
frame=["a4f2", f"+tazimuth={az}"],
cmap=True,
)
fig.colorbar(frame="af")
return fig
pn.Column(az_slider, view)Here is a screencast showing how it works locally:
Screencast.from.2023-03-23.16-55-53.webm
Although the interactive widget doesn't work on our static HTML documentation, users can still copy-and-paste the codes to try it on their own Jupyter notebooks. So I think such a tutorial is still very useful.