update examples to use new SolaraViz API (#193)

Author: Corvince

examples/aco_tsp/app.py

@@ -6,7 +6,7 @@
 import solara
 from aco_tsp.model import AcoTspModel, TSPGraph
 from matplotlib.figure import Figure
-from mesa.visualization import SolaraViz
+from mesa.visualization import SolaraViz, make_plot_measure
 
 
 def circle_portrayal_example(agent):
@@ -35,6 +35,8 @@ def circle_portrayal_example(agent):
     },
 }
 
+model = AcoTspModel()
+
 
 def make_graph(model):
     fig = Figure()
@@ -55,7 +57,7 @@ def make_graph(model):
         edge_color="gray",
     )
 
-    solara.FigureMatplotlib(fig)
+    return solara.FigureMatplotlib(fig)
 
 
 def ant_level_distances(model):
@@ -67,10 +69,8 @@ def ant_level_distances(model):
 
 
 page = SolaraViz(
-    AcoTspModel,
-    model_params,
-    space_drawer=None,
-    measures=["best_distance_iter", "best_distance", make_graph],
-    agent_portrayal=circle_portrayal_example,
+    model,
+    components=[make_plot_measure(["best_distance_iter", "best_distance"]), make_graph],
+    model_params=model_params,
     play_interval=1,
 )

examples/boid_flockers/app.py

@@ -1,5 +1,5 @@
 from boid_flockers.model import BoidFlockers
-from mesa.visualization import SolaraViz
+from mesa.visualization import SolaraViz, make_space_matplotlib
 
 
 def boid_draw(agent):
@@ -15,11 +15,12 @@ def boid_draw(agent):
     "separation": 2,
 }
 
+model = BoidFlockers(100, 100, 100, 5, 10, 2)
+
 page = SolaraViz(
-    model_class=BoidFlockers,
+    model,
+    [make_space_matplotlib(agent_portrayal=boid_draw)],
     model_params=model_params,
-    measures=[],
     name="BoidFlockers",
-    agent_portrayal=boid_draw,
 )
 page  # noqa

examples/boltzmann_wealth_model_experimental/app.py

@@ -1,4 +1,8 @@
-from mesa.visualization import SolaraViz, make_plot_measure, make_space_matplotlib
+from mesa.visualization import (
+    SolaraViz,
+    make_plot_measure,
+    make_space_matplotlib,
+)
 from model import BoltzmannWealthModel
 
 
@@ -29,9 +33,9 @@ def agent_portrayal(agent):
 
 # Create visualization elements. The visualization elements are solara components
 # that receive the model instance as a "prop" and display it in a certain way.
-# Under the hood these are just functions that receive the model instance.
-# You can also author your own visualization elements, they just have to return
-# a valid solara component or an ipywidget.
+# Under the hood these are just classes that receive the model instance.
+# You can also author your own visualization elements, which can also be functions
+# that receive the model instance and return a valid solara component.
 SpaceGraph = make_space_matplotlib(agent_portrayal)
 GiniPlot = make_plot_measure("Gini")
 

examples/conways_game_of_life_fast/app.py

@@ -1,4 +1,4 @@
-from mesa.visualization import SolaraViz
+from mesa.visualization import SolaraViz, make_plot_measure
 from model import GameOfLifeModel
 
 model_params = {
@@ -20,11 +20,16 @@
     },
 }
 
+gol = GameOfLifeModel(10, 10)
+
+TotalAlivePlot = make_plot_measure("Cells alive")
+FractionAlivePlot = make_plot_measure("Fraction alive")
+
+
 page = SolaraViz(
-    GameOfLifeModel,
-    model_params,
-    measures=["Cells alive", "Fraction alive"],
-    space_drawer=None,
+    gol,
+    components=[TotalAlivePlot, FractionAlivePlot],
+    model_params=model_params,
     name="Game of Life Model",
 )
 page  # noqa

examples/hotelling_law/app.py

@@ -5,7 +5,7 @@
 from hotelling_law.agents import ConsumerAgent, StoreAgent
 from hotelling_law.model import HotellingModel
 from matplotlib.figure import Figure
-from mesa.visualization import SolaraViz
+from mesa.visualization import SolaraViz, make_plot_measure
 
 model_params = {
     "N_stores": {
@@ -108,7 +108,8 @@ def agent_portrayal(agent):
     return portrayal
 
 
-def space_drawer(model, agent_portrayal):
+@solara.component
+def SpaceDrawer(model):
     fig = Figure(figsize=(8, 5), dpi=100)
     ax = fig.subplots()
 
@@ -338,20 +339,20 @@ def make_revenue_line_chart(model):
     return solara.FigureMatplotlib(fig)
 
 
+model1 = HotellingModel(20, 20)
+
 # Instantiate the SolaraViz component with your model
 page = SolaraViz(
-    model_class=HotellingModel,
-    model_params=model_params,
-    measures=[
+    model1,
+    components=[
+        SpaceDrawer,
         make_price_changes_line_chart,
         make_market_share_and_price_chart,
         make_market_share_line_chart,
-        "Price Variance",
+        make_plot_measure("Price Variance"),
         make_revenue_line_chart,
     ],
     name="Hotelling's Law Model",
-    agent_portrayal=agent_portrayal,
-    space_drawer=space_drawer,
     play_interval=150,
 )
 

examples/schelling_experimental/app.py

@@ -1,4 +1,4 @@
-from mesa.visualization.solara_viz import Slider, SolaraViz, make_text
+from mesa.visualization import Slider, SolaraViz, make_plot_measure
 from model import Schelling
 
 
@@ -21,10 +21,13 @@ def agent_portrayal(agent):
     "height": 20,
 }
 
+model1 = Schelling(20, 20, 0.8, 0.2, 3)
+
+HappyPlot = make_plot_measure("happy")
+
 page = SolaraViz(
-    Schelling,
-    model_params,
-    measures=["happy", make_text(get_happy_agents)],
-    agent_portrayal=agent_portrayal,
+    model1,
+    components=[HappyPlot, get_happy_agents],
+    model_params=model_params,
 )
 page  # noqa

examples/sugarscape_g1mt/app.py

@@ -1,12 +1,12 @@
 import numpy as np
 import solara
 from matplotlib.figure import Figure
-from mesa.visualization import SolaraViz
+from mesa.visualization import SolaraViz, make_plot_measure
 from sugarscape_g1mt.model import SugarscapeG1mt
 from sugarscape_g1mt.trader_agents import Trader
 
 
-def space_drawer(model, agent_portrayal):
+def SpaceDrawer(model):
     def portray(g):
         layers = {
             "sugar": [[np.nan for j in range(g.height)] for i in range(g.width)],
@@ -42,20 +42,20 @@ def portray(g):
     # Trader
     ax.scatter(**out["trader"])
     ax.set_axis_off()
-    solara.FigureMatplotlib(fig)
+    return solara.FigureMatplotlib(fig)
 
 
 model_params = {
     "width": 50,
     "height": 50,
 }
 
+model1 = SugarscapeG1mt(50, 50)
+
 page = SolaraViz(
-    SugarscapeG1mt,
-    model_params,
-    measures=["Trader", "Price"],
+    model1,
+    components=[SpaceDrawer, make_plot_measure(["Trader", "Price"])],
     name="Sugarscape {G1, M, T}",
-    space_drawer=space_drawer,
     play_interval=1500,
 )
 page  # noqa

examples/virus_on_network/app.py

@@ -3,7 +3,7 @@
 import solara
 from matplotlib.figure import Figure
 from matplotlib.ticker import MaxNLocator
-from mesa.visualization import SolaraViz, make_text
+from mesa.visualization import SolaraViz, make_space_matplotlib
 from virus_on_network.model import State, VirusOnNetwork, number_infected
 
 
@@ -57,7 +57,7 @@ def make_plot(model):
     fig.legend()
     # Set integer x axis
     ax.xaxis.set_major_locator(MaxNLocator(integer=True))
-    solara.FigureMatplotlib(fig)
+    return solara.FigureMatplotlib(fig)
 
 
 model_params = {
@@ -119,14 +119,17 @@ def make_plot(model):
     },
 }
 
+SpacePlot = make_space_matplotlib(agent_portrayal)
+
+model1 = VirusOnNetwork()
+
 page = SolaraViz(
-    VirusOnNetwork,
-    model_params,
-    measures=[
+    model1,
+    [
+        SpacePlot,
         make_plot,
-        make_text(get_resistant_susceptible_ratio),
+        get_resistant_susceptible_ratio,
     ],
     name="Virus Model",
-    agent_portrayal=agent_portrayal,
 )
 page  # noqa