This may be unbelievable — It's a live Python (language) notebook !
This notebook is viewable on a mobile device but may be difficult to appreciate, especially the charts. I recommend viewing on a larger screen, iPad or bigger.
There are two frames below. These were both created with marimo.io.
The first frame is a complete structural application which calculates the shear and moment diagrams for a beam subject to a partial uniform load. The beam is 10 units long, the loading is one 1 unit per unit length. As you scroll to the end of the first frame, you will see 3 sliders allowing the following parameters to be set:
The second frame is another ‘Hello World’ slider example — to illustrate that code snippets work inside WP Engine. I illustrate the use of lists and tables to enhance the UI.
There are two frames below. These were both created with marimo.io.
The first frame is a complete structural application which calculates the shear and moment diagrams for a beam subject to a partial uniform load. The beam is 10 units long, the loading is one 1 unit per unit length. As you scroll to the end of the first frame, you will see 3 sliders allowing the following parameters to be set:
- divisions
- size of plot markers
- rightmost extent of the partial load then
- just a demo slider with unicode (tomato and vine) characters
The charts interactively update with the slider movements.
The second frame is another ‘Hello World’ slider example — to illustrate that code snippets work inside WP Engine. I illustrate the use of lists and tables to enhance the UI.
First Frame
Second Frame
And here’s the standard ‘Hello World’ slider example just to illustrate that code snippets work inside WP Engine.
import marimo as mo
slider0 = mo.ui.slider(1, 10, label="Vines", value=3, show_value=True) slider0_text = "Vines" slider1 = mo.ui.slider(1, 10, label="Tomatoes", value=6, show_value=True) slider1_text = "Tomatoes"
mo.vstack([slider0, slider1])
table = mo.ui.table(
data=[
{"Item": slider0_text, "Value": mo.md(slider0.value * "🍃")},
{"Item": slider1_text, "Value": mo.md(slider1.value * "🍅")},
],
label="",
)
mo.vstack([table, table.value])
col0 = [slider0_text, slider1_text] col1 = [slider0.value * "🍃", slider1.value * "🍅"] mo.vstack([col0, col1])
