{ "version": "1", "metadata": { "marimo_version": "0.15.2" }, "cells": [ { "id": "Hbol", "code_hash": "1d0db38904205bec4d6f6f6a1f6cec3e", "outputs": [ { "type": "data", "data": { "text/plain": "" } } ], "console": [] }, { "id": "NGam", "code_hash": "c780de0fed2f3e42aa282257390c566e", "outputs": [ { "type": "data", "data": { "text/html": "

Wigglystuff: widgets interactivos

" } } ], "console": [] }, { "id": "MJUe", "code_hash": "9050c4a0d0cba47a112513cf8cd2238e", "outputs": [ { "type": "data", "data": { "text/html": "

Slider2D demo

\n
from wigglystuff import Slider2D\n\nslider_2d = Slider2D(width=300, height=300)\n
\nThis demo contains a two dimensional slider. The thinking is that sometimes you want to be able to make changes to two variables at the same time. The output is always standardized to the range of -1 to 1, but you can always use custom code to adapt this.
" } } ], "console": [] }, { "id": "vblA", "code_hash": "f3910f30402ad0b1693067e3bc97b73e", "outputs": [ { "type": "data", "data": { "text/html": "

Matrix demo

\n
from wigglystuff import Matrix\n\narr = Matrix(rows=1, cols=2, step=0.1)\nmat = Matrix(matrix=np.eye(2), mirror=True, step=0.1)\n
\nThis demo contains a representation of a two dimensional gaussian distribution. You can adapt the center by changing the first array that represents the mean and the variance can be updated by alterering the second one that represents the covariance matrix. Notice how the latter matrix has a triangular constraint.
" } } ], "console": [] }, { "id": "bkHC", "code_hash": "fdbbf7c3c127c0f02a26d48ac10f5e41", "outputs": [ { "type": "data", "data": { "text/plain": "" } } ], "console": [] }, { "id": "lEQa", "code_hash": "ca21380b35c5b5ae9381cd64eb72b4f7", "outputs": [ { "type": "data", "data": { "text/html": "

PCA demo with Matrix

\nEver want to do your own PCA? Try to figure out a mapping from a 3d color map to a 2d representation with the transformation matrix below.
" } } ], "console": [] }, { "id": "PKri", "code_hash": "1b6d191c163a6a2af2318e9e3f91b2bb", "outputs": [ { "type": "data", "data": { "text/html": "

Tangle objects

\nVery much inspired by tangle.js, this library also offers some sliders/choice elements that can natively be combined in markdown. \n
from wigglystuff import TangleSlider\n
\nThere are some examples below. \n

Apples example

\nSuppose that you have and they each cost then in total you would need to spend $35.00. \n

Amdhals law

\nYou cannot always get a speedup by throwing more compute at a problem. Let's compare two scenarios. \n\nThe consequences of these choices are shown below. You might be suprised at the result, but you need to remember that if you throw more cores at the problem then you will also have more cores that will idle when the program needs to sync.

Also a choice widget

\nThe slider widget can do numeric values for you, but sometimes you also want to make a choice between discrete choices. For that, you can use the TangleChoice widget. \n
from wigglystuff import TangleChoice\n
\nAs a quick demo, let's repeat . \n\ud83d\ude42 \ud83d\ude42 \ud83d\ude42

Also a select widget

\nLike TangleChoice but as a drop-down\n
from wigglystuff import TangleSelect\n
\nAs a quick demo, let's repeat . \n\ud83e\udd54 \ud83e\udd54 \ud83e\udd54
" } } ], "console": [] }, { "id": "Xref", "code_hash": "cff25d66316937ad1b56471bb5a17f42", "outputs": [ { "type": "data", "data": { "text/html": "

Pick colors

\nPick colors using a standard browser color input.\n
from wigglystuff import ColorPicker\nColorPicker(color="#444444")\n
\nYou can use a color picker with marimo's Html to affect how things are rendered.

Change my color!

You selected #444444 which is (68, 68, 68) in RGB values.
" } } ], "console": [] }, { "id": "SFPL", "code_hash": "9ad8211e7bdae72423749de8de29a3ba", "outputs": [ { "type": "data", "data": { "text/html": "

Drawing Edges

\nWe even have a tool that allows you to connect nodes by drawing edges!\n
from wigglystuff import EdgeDraw\nEdgeDraw(["a", "b", "c", "d"])\n
\nTry it yourself by drawing below. As you draw more nodes, you will also update the widget.links property.
" } } ], "console": [] }, { "id": "BYtC", "code_hash": "7b7250c26d21a902ab2deac1c5f26107", "outputs": [ { "type": "data", "data": { "text/html": "

Sortable Lists

\n
from wigglystuff import SortableList\nSortableList(["Action", "Comedy", "Drama"], addable=True, removable=True, editable=True)\n
\nTry dragging items to reorder, adding new items, clicking to edit, or removing with the [x] buttons.Current value: {'addable': True, 'editable': True, 'removable': True, 'value': ['Action', 'Comedy', 'Drama', 'Thriller', 'Sci-Fi']}
" } } ], "console": [] }, { "id": "RGSE", "code_hash": "1ad9258c9f9c64aedde554ff9ab58c40", "outputs": [ { "type": "data", "data": { "text/plain": "" } } ], "console": [] }, { "id": "Kclp", "code_hash": "568415479d3d99332fbc67d3145496d1", "outputs": [ { "type": "data", "data": { "text/plain": "" } } ], "console": [] }, { "id": "emfo", "code_hash": "8ff5f2025caa808c1917198a1495752b", "outputs": [ { "type": "data", "data": { "text/plain": "" } } ], "console": [] }, { "id": "Hstk", "code_hash": "af92c83409663d602d533d59c43e7b85", "outputs": [ { "type": "data", "data": { "text/plain": "" } } ], "console": [] }, { "id": "nWHF", "code_hash": "34d6e908344de5458dee5caa97eeb5ad", "outputs": [ { "type": "data", "data": { "text/plain": "" } } ], "console": [] }, { "id": "iLit", "code_hash": "0375fff98cfe90dc66339b8ae414fec3", "outputs": [ { "type": "data", "data": { "text/plain": "" } } ], "console": [] }, { "id": "ZHCJ", "code_hash": "483aff27897234a40b86a84af494dd3b", "outputs": [ { "type": "data", "data": { "text/plain": "" } } ], "console": [] }, { "id": "ROlb", "code_hash": "79c2f3bebf808dfc8be2f4b9421f9cfe", "outputs": [ { "type": "data", "data": { "text/plain": "" } } ], "console": [] }, { "id": "qnkX", "code_hash": "e8e31ea7295e9f2ff00413a1175524fc", "outputs": [ { "type": "data", "data": { "text/plain": "" } } ], "console": [] }, { "id": "TqIu", "code_hash": "c59b19d25dd66c9574e82b9d36f58abe", "outputs": [ { "type": "data", "data": { "text/plain": "" } } ], "console": [] }, { "id": "Vxnm", "code_hash": "5a7cfa3e2fcd83131fa6291eb5ffda81", "outputs": [ { "type": "data", "data": { "text/plain": "" } } ], "console": [] }, { "id": "DnEU", "code_hash": "ca485cb8427287c296a9b416bd110e68", "outputs": [ { "type": "data", "data": { "text/plain": "" } } ], "console": [] }, { "id": "ulZA", "code_hash": "5a5be9873522b51df874fa0412ee6867", "outputs": [ { "type": "data", "data": { "text/plain": "" } } ], "console": [] } ] }