From 527d9dfa00c0b2ad61ce9f3905437b90fe84f00a Mon Sep 17 00:00:00 2001 From: Egutierrez Date: Mon, 8 Sep 2025 03:02:01 +0200 Subject: [PATCH] Add new features and updates to dibujar.py and pygwalker_visualizaciones.py - Introduced a new markdown cell in dibujar.py to enhance user guidance for drawing with the mouse. - Updated the version in pygwalker_visualizaciones.py from 0.15.1 to 0.15.2. - Added a new markdown cell in pygwalker_visualizaciones.py for interactive EDA with PyGWalker. - Refactored return values in pygwalker_visualizaciones.py to streamline data handling. - Modified Graficos_plotly.grid.json to include additional layout positions. --- Graficos_altair.py | 20 +++-- Graficos_plotly.py | 15 +++- Wigglystuff_widgets_jupyter.py | 11 ++- __marimo__/session/Graficos_altair.py.json | 37 +++++++++- __marimo__/session/Graficos_plotly.py.json | 50 ++++++++++--- .../Wigglystuff_widgets_jupyter.py.json | 73 +++++++++++-------- __marimo__/session/dibujar.py.json | 23 ++++-- .../session/pygwalker_visualizaciones.py.json | 38 ++++++++-- dibujar.py | 6 ++ layouts/Graficos_plotly.grid.json | 6 ++ pygwalker_visualizaciones.py | 16 +++- 11 files changed, 227 insertions(+), 68 deletions(-) diff --git a/Graficos_altair.py b/Graficos_altair.py index df32c88..b17dc21 100644 --- a/Graficos_altair.py +++ b/Graficos_altair.py @@ -1,17 +1,28 @@ import marimo -__generated_with = "0.15.1" +__generated_with = "0.15.2" app = marimo.App(width="columns") @app.cell(column=0) def _(): import marimo as mo + return (mo,) + + +@app.cell +def _(mo): + mo.md(r"""# Altair: graficos interactivos""") + return + + +@app.cell +def _(): from vega_datasets import data import altair as alt import pandas as pd import pyarrow - return alt, data, mo, pd + return alt, data, pd @app.cell @@ -64,7 +75,6 @@ def _(alt, mo, pd): bar_chart1 = mo.ui.altair_chart(_bar_chart1) bar_chart1 - return bar_chart1, dataset @@ -123,7 +133,6 @@ def _(alt, data, mo): weather_chart2 = mo.ui.altair_chart(layered_chart2) weather_chart2 - return dataset_weather2, weather_chart2 @@ -197,7 +206,6 @@ def _(alt, data, mo): movies_chart3 = mo.ui.altair_chart(layered_movies3) movies_chart3 - return @@ -237,7 +245,6 @@ def _(alt, data, mo): movies_rect4 = mo.ui.altair_chart(rect4.add_params(pts4)) movies_rect4 - return dataset_movies4, pts4, x1, y1 @@ -257,7 +264,6 @@ def _(alt, dataset_movies4, mo, pts4, x1, y1): movies_circ4 = mo.ui.altair_chart(circ4) movies_circ4 - return diff --git a/Graficos_plotly.py b/Graficos_plotly.py index 1fd48bc..938b53f 100644 --- a/Graficos_plotly.py +++ b/Graficos_plotly.py @@ -9,8 +9,19 @@ app = marimo.App( @app.cell def _(): - # Cell 1: gráfico Plotly (reactivo) import marimo as mo + return (mo,) + + +@app.cell(hide_code=True) +def _(mo): + mo.md(r""" # Plotly: Graficos interactivos con plotly""") + return + + +@app.cell +def _(mo): + # Cell 1: gráfico Plotly (reactivo) import pandas as pd import plotly.express as px import numpy as np @@ -28,7 +39,7 @@ def _(): plot = mo.ui.plotly(fig) # Solo scatter/treemap/sunburst soportan selección reactiva plot - return df, mo, np, pd, plot, px + return df, np, pd, plot, px @app.cell diff --git a/Wigglystuff_widgets_jupyter.py b/Wigglystuff_widgets_jupyter.py index ba47ab6..8983884 100644 --- a/Wigglystuff_widgets_jupyter.py +++ b/Wigglystuff_widgets_jupyter.py @@ -6,6 +6,13 @@ app = marimo.App(width="medium") @app.cell def _(): + import marimo as mo + return (mo,) + + +@app.cell +def _(mo): + mo.md(r"""# Wigglystuff: widgets interactivos""") return @@ -279,13 +286,13 @@ def _(mo): @app.cell def _(): import altair as alt - import marimo as mo + # import marimo as mo import micropip import numpy as np import pandas as pd # await micropip.install("wigglystuff==0.1.1") - return alt, mo, np, pd + return alt, np, pd @app.cell diff --git a/__marimo__/session/Graficos_altair.py.json b/__marimo__/session/Graficos_altair.py.json index dfb966e..40b40d1 100644 --- a/__marimo__/session/Graficos_altair.py.json +++ b/__marimo__/session/Graficos_altair.py.json @@ -1,13 +1,46 @@ { "version": "1", "metadata": { - "marimo_version": "0.15.1" + "marimo_version": "0.15.2" }, "cells": [ + { + "id": "ABIT", + "code_hash": "1d0db38904205bec4d6f6f6a1f6cec3e", + "outputs": [ + { + "type": "data", + "data": { + "text/plain": "" + } + } + ], + "console": [] + }, + { + "id": "DhHd", + "code_hash": "0a5af7d2e3c1f5f359897f5fbbb24070", + "outputs": [ + { + "type": "data", + "data": { + "text/html": "

Altair: graficos interactivos

" + } + } + ], + "console": [] + }, { "id": "Hbol", "code_hash": "0914bd1bbeb9727790bfe2b5da7b0eb3", - "outputs": [], + "outputs": [ + { + "type": "error", + "ename": "multiple-defs", + "evalue": "The variable 'mo' was defined by another cell", + "traceback": [] + } + ], "console": [] }, { diff --git a/__marimo__/session/Graficos_plotly.py.json b/__marimo__/session/Graficos_plotly.py.json index 8257d93..754ab67 100644 --- a/__marimo__/session/Graficos_plotly.py.json +++ b/__marimo__/session/Graficos_plotly.py.json @@ -5,13 +5,39 @@ }, "cells": [ { - "id": "Hbol", - "code_hash": "1287e6023f19dd45c7336fc73406baf4", + "id": "ukVd", + "code_hash": "1d0db38904205bec4d6f6f6a1f6cec3e", "outputs": [ { "type": "data", "data": { - "text/html": "" + "text/plain": "" + } + } + ], + "console": [] + }, + { + "id": "UROO", + "code_hash": "8171d8355b201d2405ba06b25bcd04c5", + "outputs": [ + { + "type": "data", + "data": { + "text/html": "

Plotly: Graficos interactivos con plotly

" + } + } + ], + "console": [] + }, + { + "id": "Hbol", + "code_hash": "7e4a39a67224ad4491e03af7ef325d68", + "outputs": [ + { + "type": "data", + "data": { + "text/html": "" } } ], @@ -24,7 +50,7 @@ { "type": "data", "data": { - "text/html": "" + "text/html": "" } } ], @@ -37,7 +63,7 @@ { "type": "data", "data": { - "text/html": "" + "text/html": "" } } ], @@ -50,7 +76,7 @@ { "type": "data", "data": { - "text/html": "
" + "text/html": "
" } } ], @@ -63,7 +89,7 @@ { "type": "data", "data": { - "text/html": "" + "text/html": "" } } ], @@ -76,7 +102,7 @@ { "type": "data", "data": { - "text/html": "" + "text/html": "" } } ], @@ -89,7 +115,7 @@ { "type": "data", "data": { - "text/html": "" + "text/html": "" } } ], @@ -102,7 +128,7 @@ { "type": "data", "data": { - "text/html": "" + "text/html": "" } } ], @@ -115,7 +141,7 @@ { "type": "data", "data": { - "text/html": "" + "text/html": "" } } ], @@ -128,7 +154,7 @@ { "type": "data", "data": { - "text/html": "" + "text/html": "" } } ], diff --git a/__marimo__/session/Wigglystuff_widgets_jupyter.py.json b/__marimo__/session/Wigglystuff_widgets_jupyter.py.json index a17f346..4a9dad4 100644 --- a/__marimo__/session/Wigglystuff_widgets_jupyter.py.json +++ b/__marimo__/session/Wigglystuff_widgets_jupyter.py.json @@ -6,7 +6,7 @@ "cells": [ { "id": "Hbol", - "code_hash": null, + "code_hash": "1d0db38904205bec4d6f6f6a1f6cec3e", "outputs": [ { "type": "data", @@ -18,33 +18,46 @@ "console": [] }, { - "id": "iCyg", + "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.
" + "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": "tPql", + "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.
" + "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": "kXBK", + "id": "bkHC", "code_hash": "fdbbf7c3c127c0f02a26d48ac10f5e41", "outputs": [ { @@ -57,72 +70,72 @@ "console": [] }, { - "id": "UEJN", + "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.
" + "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": "kmId", + "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 $139.86. \n

Amdhals law

\nYou cannot always get a speedup by throwing more compute at a problem. Let's compare two scenarios. \n
    \n
  • You might have a parallel program that needs to sync up .
  • \n
  • Another parallel program needs to sync up .
  • \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\udca5 \ud83d\udca5 \ud83d\udca5 \ud83d\udca5 \ud83d\udca5 \ud83d\udca5 \ud83d\udca5 \ud83d\udca5 \ud83d\udca5 \ud83d\udca5

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\udd55 \ud83e\udd55 \ud83e\udd55 \ud83e\udd55 \ud83e\udd55 \ud83e\udd55 \ud83e\udd55 \ud83e\udd55 \ud83e\udd55 \ud83e\udd55
" + "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
    \n
  • You might have a parallel program that needs to sync up .
  • \n
  • Another parallel program needs to sync up .
  • \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": "zjsC", + "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 #00d5ff which is (0, 213, 255) in RGB values.
" + "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": "nknI", + "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.
" + "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": "gZjT", + "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', 'Drama', 'Comedy', 'Thriller', 'holaa']}
" + "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": "YLZr", + "id": "RGSE", "code_hash": "1ad9258c9f9c64aedde554ff9ab58c40", "outputs": [ { @@ -135,7 +148,7 @@ "console": [] }, { - "id": "ConS", + "id": "Kclp", "code_hash": "568415479d3d99332fbc67d3145496d1", "outputs": [ { @@ -148,7 +161,7 @@ "console": [] }, { - "id": "ucSh", + "id": "emfo", "code_hash": "8ff5f2025caa808c1917198a1495752b", "outputs": [ { @@ -161,7 +174,7 @@ "console": [] }, { - "id": "RJXt", + "id": "Hstk", "code_hash": "af92c83409663d602d533d59c43e7b85", "outputs": [ { @@ -174,8 +187,8 @@ "console": [] }, { - "id": "fJtZ", - "code_hash": "54d2df7a4d70b672f5d215d409bb38e5", + "id": "nWHF", + "code_hash": "34d6e908344de5458dee5caa97eeb5ad", "outputs": [ { "type": "data", @@ -187,7 +200,7 @@ "console": [] }, { - "id": "wbSK", + "id": "iLit", "code_hash": "0375fff98cfe90dc66339b8ae414fec3", "outputs": [ { @@ -200,7 +213,7 @@ "console": [] }, { - "id": "RYxB", + "id": "ZHCJ", "code_hash": "483aff27897234a40b86a84af494dd3b", "outputs": [ { @@ -213,7 +226,7 @@ "console": [] }, { - "id": "bQnD", + "id": "ROlb", "code_hash": "79c2f3bebf808dfc8be2f4b9421f9cfe", "outputs": [ { @@ -226,7 +239,7 @@ "console": [] }, { - "id": "bxOs", + "id": "qnkX", "code_hash": "e8e31ea7295e9f2ff00413a1175524fc", "outputs": [ { @@ -239,7 +252,7 @@ "console": [] }, { - "id": "LxCL", + "id": "TqIu", "code_hash": "c59b19d25dd66c9574e82b9d36f58abe", "outputs": [ { @@ -252,7 +265,7 @@ "console": [] }, { - "id": "qmAx", + "id": "Vxnm", "code_hash": "5a7cfa3e2fcd83131fa6291eb5ffda81", "outputs": [ { @@ -265,7 +278,7 @@ "console": [] }, { - "id": "hpwO", + "id": "DnEU", "code_hash": "ca485cb8427287c296a9b416bd110e68", "outputs": [ { @@ -278,7 +291,7 @@ "console": [] }, { - "id": "MVsS", + "id": "ulZA", "code_hash": "5a5be9873522b51df874fa0412ee6867", "outputs": [ { diff --git a/__marimo__/session/dibujar.py.json b/__marimo__/session/dibujar.py.json index d88e85d..0bde983 100644 --- a/__marimo__/session/dibujar.py.json +++ b/__marimo__/session/dibujar.py.json @@ -18,7 +18,20 @@ "console": [] }, { - "id": "nrrw", + "id": "eVAZ", + "code_hash": "5004c878daf07d3b0f339c94333f1ffc", + "outputs": [ + { + "type": "data", + "data": { + "text/html": "

Dibujar: Dibujar con el raton y recibir la imagen

" + } + } + ], + "console": [] + }, + { + "id": "MJUe", "code_hash": "6e07194e63c874f7cc605c2780df57f4", "outputs": [ { @@ -31,26 +44,26 @@ "console": [] }, { - "id": "Rswn", + "id": "vblA", "code_hash": "b93c0380658af6b5e21fb50ebc9e62fa", "outputs": [ { "type": "data", "data": { - "text/html": "" + "text/html": "" } } ], "console": [] }, { - "id": "Whkl", + "id": "bkHC", "code_hash": "9faa5a53b20314ed086c62db17330f36", "outputs": [ { "type": "data", "data": { - "text/html": "
" + "text/html": "
" } } ], diff --git a/__marimo__/session/pygwalker_visualizaciones.py.json b/__marimo__/session/pygwalker_visualizaciones.py.json index debe59a..e22cc59 100644 --- a/__marimo__/session/pygwalker_visualizaciones.py.json +++ b/__marimo__/session/pygwalker_visualizaciones.py.json @@ -1,12 +1,38 @@ { "version": "1", "metadata": { - "marimo_version": "0.15.1" + "marimo_version": "0.15.2" }, "cells": [ { "id": "Hbol", - "code_hash": "196a8f8c61fff0f57c368c7d0f4e2744", + "code_hash": "235e4acb9dbf6f1122f38c96a23faa16", + "outputs": [ + { + "type": "data", + "data": { + "text/plain": "" + } + } + ], + "console": [] + }, + { + "id": "UAOh", + "code_hash": "e025d3101d5c796fcce617a895f0504b", + "outputs": [ + { + "type": "data", + "data": { + "text/html": "

PyGWalker: EDA rapido e interactivo con pygwalker

" + } + } + ], + "console": [] + }, + { + "id": "xBJG", + "code_hash": "5866cdb86d60d77e4f550db6faec6813", "outputs": [ { "type": "data", @@ -24,7 +50,7 @@ { "type": "data", "data": { - "text/html": "

1) Selecciona un dataset y preferencias

" + "text/html": "

1) Selecciona un dataset y preferencias

" } } ], @@ -50,7 +76,7 @@ { "type": "data", "data": { - "text/html": "" + "text/html": "" } } ], @@ -63,7 +89,7 @@ { "type": "data", "data": { - "text/html": "" + "text/html": "" } } ], @@ -76,7 +102,7 @@ { "type": "data", "data": { - "text/html": "\n
\n \n \n \n \n \n
\n\n\n" + "text/html": "\n
\n \n \n \n \n \n
\n\n\n" } } ], diff --git a/dibujar.py b/dibujar.py index c78eabc..4ffda09 100644 --- a/dibujar.py +++ b/dibujar.py @@ -10,6 +10,12 @@ def _(): return (mo,) +@app.cell +def _(mo): + mo.md(r""" # Dibujar: Dibujar con el raton y recibir la imagen""") + return + + @app.cell def _(): from modraw import Draw diff --git a/layouts/Graficos_plotly.grid.json b/layouts/Graficos_plotly.grid.json index 69557a7..9f58b86 100644 --- a/layouts/Graficos_plotly.grid.json +++ b/layouts/Graficos_plotly.grid.json @@ -15,6 +15,12 @@ { "position": null }, + { + "position": null + }, + { + "position": null + }, { "position": [ 0, diff --git a/pygwalker_visualizaciones.py b/pygwalker_visualizaciones.py index dc59a8b..6bdb9e3 100644 --- a/pygwalker_visualizaciones.py +++ b/pygwalker_visualizaciones.py @@ -1,6 +1,6 @@ import marimo -__generated_with = "0.15.1" +__generated_with = "0.15.2" app = marimo.App(width="medium") @@ -8,6 +8,18 @@ app = marimo.App(width="medium") def _(): # Cell 1 — Imports y utilidades import marimo as mo + + return (mo,) + + +@app.cell +def _(mo): + mo.md(r"""# PyGWalker: EDA rapido e interactivo con pygwalker""") + return + + +@app.cell +def _(): import os import pandas as pd import numpy as np @@ -25,7 +37,7 @@ def _(): DATASET_URLS: Dict[str, str] = { "Bike Sharing (DC)": "https://kanaries-app.s3.ap-northeast-1.amazonaws.com/public-datasets/bike_sharing_dc.csv", } - return DATASET_URLS, mo, pd, pyg, vega_data + return DATASET_URLS, pd, pyg, vega_data @app.cell