I made a "notebook" where I use a mo.ui.slider which triggers the redraw of a matplotlib plot. But my approach is very naive and the result is ugly:
# first phi = mo.ui.slider(-10, 10, 0.1, value=-2, label="$\\varphi$") # then plt.plot(x_arr, np.sin(x_arr + phi.value)) plt.show()
Before marimo, I used some kind of in-place update routine like :
line.set_ydata(np.sin(x_arr + phi.value)) fig.canvas.draw()
But it requires the figure to be setup beforehand... And I don't know how to do that
I don't know how to smartly update the plot in marimo, without triggering a full draw again. Full draw which causes the plot to flicker, which looks ugly...
Here is the snippet of code I'm talking about if you wanna see by yourself
import marimo
__generated_with = "0.10.13"
app = marimo.App()
@app.cell(hide_code=True)
def _():
import marimo as mo
import numpy as np
import matplotlib.pyplot as plt
return mo, np, plt
@app.cell
def _(mo, np):
x_arr = np.linspace(-8, 8, 1024)
phi = mo.ui.slider(-10, 10, 0.1, value=-2, label="$\\varphi$")
return phi, x_arr
@app.cell
def _(mo, phi):
mo.vstack([
mo.hstack([phi, mo.md(f"{phi.value:0.02f}"),]),
])
return
@app.cell
def _(np, phi, plt, x_arr):
plt.plot(x_arr, np.sin(x_arr + phi.value))
plt.grid()
plt.show()
return
if __name__ == "__main__":
app.run()mo.audio(src="https://bitmidi.com/uploads/79828.mid")