import vizro.models as vm
import vizro.plotly.express as px
from vizro import Vizro
gapminder = px.data.gapminder()
# Page 1: Simple example with one component
page_one = vm.Page(title="Page 1", components=[vm.Card(text="# Good morning! ☕")])
dashboard = vm.Dashboard(pages=[page_one])
app = Vizro().build(dashboard).dash
# Page 2: Add more components e.g. a graph or a table
'''
vm.Graph(
figure=px.box(
gapminder,
x="continent",
y="lifeExp",
color="continent",
)
)
'''
# Page 3: Add a filter
'''
controls=[vm.Filter(column="continent")]
'''
# Page 4: Change the layout
'''
layout=vm.Layout(grid=[[0, 1, 1]]),
'''
# Change navigation
'''
vm.Navigation(nav_selector=vm.NavBar())
'''
'''
items=[
vm.NavLink(label="Group A", pages=["Page 1", "Page 2"], icon="Home"),
vm.NavLink(label="Group B", pages=["Page 3", "Page 4"], icon="Globe"),
]
'''