Multi page app documentation

Hi @micdonato ! I’m sure there are multiple ways of achieving this so I hope more people will chime in to bring their own experience.

I could suggest something like the following, where I use one of the templates provided by Panel to add buttons in the sidebar, clicking on a button updates the content of the main area. Well, too be more accurate, it updates the content of a Column layout that is the only component added here in the main area, since the main area should not be updated directly (this is mentioned multiple times in the documentation).

import panel as pn
import holobiews as hv
import nunpy as np

pn.extension()

vanilla = pn.template.VanillaTemplate(title='Vanilla Template')

xs = np.linspace(0,np.pi)
freq = pn.widgets.FloatSlider(name="Frequency", start=0, end=10, value=2)
phase = pn.widgets.FloatSlider(name="Phase", start=0, end=np.pi)

@pn.depends(freq=freq, phase=phase)
def sine(freq, phase):
    return hv.Curve((xs, np.sin(xs*freq+phase))).opts(
        responsive=True, min_height=400)

@pn.depends(freq=freq, phase=phase)
def cosine(freq, phase):
    return hv.Curve((xs, np.cos(xs*freq+phase))).opts(
        responsive=True, min_height=400)

page = pn.Column(sizing_mode='stretch_width')

content1 = [
    pn.Row(freq, phase),
    hv.DynamicMap(sine),
]
content2 = [
    pn.Row(freq, phase),
    hv.DynamicMap(cosine),
]

link1 = pn.widgets.Button(name='Sine')
link2 = pn.widgets.Button(name='Cosine')

vanilla.sidebar.append(link1)
vanilla.sidebar.append(link2)

vanilla.main.append(page)

def load_content1(event):
    vanilla.main[0].objects = content1


def load_content2(event):
    vanilla.main[0].objects = content2
    
link1.on_click(load_content1)
link2.on_click(load_content2)

vanilla.show()

So this ends up not being a multipage app per say, it’s just a rather dynamic single-page app.

A simpler solution, without sidebar though, would be to simply use Tabs.

2 Likes