Curve Editor Lab

import%20marimo%0A%0A__generated_with%20%3D%20%220.23.13%22%0Aapp%20%3D%20marimo.App(width%3D%22full%22%2C%20app_title%3D%22Curve%20Editor%20Lab%22)%0A%0A%0A%40app.cell(hide_code%3DTrue)%0Adef%20_()%3A%0A%20%20%20%20import%20marimo%20as%20mo%0A%20%20%20%20import%20numpy%20as%20np%0A%20%20%20%20import%20matplotlib.pyplot%20as%20plt%0A%20%20%20%20from%20wigglystuff%20import%20Excalidraw%2C%20CurveEditor%2C%20BezierCurve%0A%0A%20%20%20%20return%20CurveEditor%2C%20Excalidraw%2C%20mo%2C%20np%2C%20plt%0A%0A%0A%40app.cell(hide_code%3DTrue)%0Adef%20_(CurveEditor%2C%20mo)%3A%0A%20%20%20%20editor%20%3D%20mo.ui.anywidget(CurveEditor(%0A%20%20%20%20%20%20%20%20x_bounds%3D(0.0%2C%2010.0)%2C%0A%20%20%20%20%20%20%20%20y_bounds%3D(-5.0%2C%205.0)%2C%0A%20%20%20%20%20%20%20%20width%3D700%2C%20height%3D400%2C%0A%20%20%20%20%20%20%20%20show_axes%3DTrue%2C%0A%20%20%20%20%20%20%20%20n_samples%3D200%2C%0A%20%20%20%20))%0A%20%20%20%20return%20(editor%2C)%0A%0A%0A%40app.cell(hide_code%3DTrue)%0Adef%20_(Excalidraw%2C%20mo)%3A%0A%20%20%20%20whiteboard%20%3D%20mo.ui.anywidget(Excalidraw(height%3D500%2C%20theme%3D%22dark%22))%0A%20%20%20%20return%20(whiteboard%2C)%0A%0A%0A%40app.cell(hide_code%3DTrue)%0Adef%20_(np)%3A%0A%20%20%20%20def%20sample_curve(widget%2C%20n_pts%3D200)%3A%0A%20%20%20%20%20%20%20%20%22%22%22Extract%20sampled%20curve%20points%20from%20the%20CurveEditor%20widget.%22%22%22%0A%20%20%20%20%20%20%20%20try%3A%0A%20%20%20%20%20%20%20%20%20%20%20%20pts%20%3D%20widget.points%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20pts%20is%20None%20or%20len(pts)%20%3C%202%3A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20return%20None%2C%20None%0A%20%20%20%20%20%20%20%20%20%20%20%20%23%20points%20is%20%5B(x%2C%20y)%2C%20...%5D%20from%20the%20editor%0A%20%20%20%20%20%20%20%20%20%20%20%20xs%20%3D%20np.array(%5Bp%5B0%5D%20for%20p%20in%20pts%5D)%0A%20%20%20%20%20%20%20%20%20%20%20%20ys%20%3D%20np.array(%5Bp%5B1%5D%20for%20p%20in%20pts%5D)%0A%20%20%20%20%20%20%20%20%20%20%20%20return%20xs%2C%20ys%0A%20%20%20%20%20%20%20%20except%20Exception%3A%0A%20%20%20%20%20%20%20%20%20%20%20%20return%20None%2C%20None%0A%0A%20%20%20%20return%20(sample_curve%2C)%0A%0A%0A%40app.cell(hide_code%3DTrue)%0Adef%20_(editor%2C%20mo%2C%20plt%2C%20sample_curve)%3A%0A%20%20%20%20xs%2C%20ys%20%3D%20sample_curve(editor)%0A%0A%20%20%20%20mo.stop(xs%20is%20None%20or%20len(xs)%20%3D%3D%200%2C%0A%20%20%20%20%20%20%20%20%20%20%20%20mo.md(%22%3E%20%F0%9F%91%86%20**Drag%20the%20control%20points**%20on%20the%20CurveEditor%20above%20to%20shape%20a%20curve.%22))%0A%0A%20%20%20%20fig%2C%20ax%20%3D%20plt.subplots(figsize%3D(8%2C%204))%0A%20%20%20%20fig.patch.set_facecolor('%230a0a0f')%0A%20%20%20%20ax.set_facecolor('%230a0a0f')%0A%0A%20%20%20%20ax.plot(xs%2C%20ys%2C%20color%3D'%2300d4ff'%2C%20linewidth%3D2.5%2C%20label%3D'Your%20Curve')%0A%20%20%20%20ax.fill_between(xs%2C%20ys%2C%20alpha%3D0.1%2C%20color%3D'%2300d4ff')%0A%20%20%20%20ax.axhline(0%2C%20color%3D'white'%2C%20alpha%3D0.2%2C%20linewidth%3D0.5)%0A%20%20%20%20ax.set_xlabel('x'%2C%20color%3D'white'%2C%20fontsize%3D12)%0A%20%20%20%20ax.set_ylabel('y'%2C%20color%3D'white'%2C%20fontsize%3D12)%0A%20%20%20%20ax.set_title('Sampled%20Curve%20Output'%2C%20color%3D'white'%2C%20fontsize%3D14)%0A%20%20%20%20ax.tick_params(colors%3D'white')%0A%20%20%20%20for%20spine%20in%20ax.spines.values()%3A%0A%20%20%20%20%20%20%20%20spine.set_color('white')%0A%20%20%20%20ax.legend(facecolor%3D'%231a1a2e'%2C%20edgecolor%3D'%23333'%2C%20labelcolor%3D'white')%0A%20%20%20%20plt.tight_layout()%0A%20%20%20%20plt%0A%20%20%20%20return%0A%0A%0A%40app.cell(hide_code%3DTrue)%0Adef%20_(mo)%3A%0A%20%20%20%20mo.md(%22%22%22%0A%20%20%20%20%23%23%20%F0%9F%8E%9B%EF%B8%8F%20Curve%20Editor%20%2B%20Excalidraw%20Lab%0A%0A%20%20%20%20A%20dual-surface%20exploration%20environment%3A%0A%0A%20%20%20%20**Top**%3A%20The%20**CurveEditor**%20widget%20%E2%80%94%20drag%20control%20points%20to%20shape%20smooth%20curves.%0A%20%20%20%20%20%20-%20Natural%20cubic%20spline%20interpolation%0A%20%20%20%20%20%20-%20Configurable%20bounds%2C%20sampling%20resolution%2C%20and%20axes%0A%20%20%20%20%20%20-%20Real-time%20reactive%20updates%0A%0A%20%20%20%20**Bottom**%3A%20Full%20**Excalidraw%20whiteboard**%20for%20sketching%2C%20annotating%2C%20and%20freeform%20math.%0A%0A%20%20%20%20%23%23%23%20Try%20This%0A%20%20%20%201.%20Drag%20the%20control%20points%20on%20the%20CurveEditor%20to%20shape%20a%20curve%0A%20%20%20%202.%20Watch%20the%20sampled%20output%20update%20reactively%20below%0A%20%20%20%203.%20Use%20the%20Excalidraw%20whiteboard%20to%20annotate%20features%2C%20sketch%20derivatives%2C%20or%20design%20companion%20curves%0A%20%20%20%204.%20Export%20your%20work%20%E2%80%94%20CurveEditor%20state%20is%20available%20programmatically%2C%20Excalidraw%20exports%20to%20PNG%0A%20%20%20%20%22%22%22)%0A%20%20%20%20return%0A%0A%0A%40app.cell(hide_code%3DTrue)%0Adef%20_(editor)%3A%0A%20%20%20%20editor%0A%20%20%20%20return%0A%0A%0A%40app.cell(hide_code%3DTrue)%0Adef%20_(mo)%3A%0A%20%20%20%20mo.md(%22%22%22%0A%20%20%20%20%23%23%20%E2%9C%8F%EF%B8%8F%20Excalidraw%20Whiteboard%0A%20%20%20%20%22%22%22)%0A%20%20%20%20return%0A%0A%0A%40app.cell(hide_code%3DTrue)%0Adef%20_(whiteboard)%3A%0A%20%20%20%20whiteboard%0A%20%20%20%20return%0A%0A%0A%40app.cell(hide_code%3DTrue)%0Adef%20_(mo)%3A%0A%20%20%20%20mo.md(%22%22%22%0A%20%20%20%20---%0A%20%20%20%20%23%23%23%20How%20It%20Works%0A%0A%20%20%20%20This%20demo%20pairs%20two%20interactive%20surfaces%3A%0A%0A%20%20%20%201.%20**CurveEditor**%20(%60wigglystuff.CurveEditor%60)%3A%20A%20spline-based%20curve%20editor%20with%20draggable%20control%20points.%0A%20%20%20%20%20%20%20Points%20are%20synced%20to%20Python%20via%20the%20%60points%60%20traitlet%20%E2%80%94%20you%20can%20access%20them%20programmatically%0A%20%20%20%20%20%20%20for%20further%20analysis%2C%20fitting%2C%20or%20export.%0A%0A%20%20%20%202.%20**Excalidraw**%20(%60wigglystuff.Excalidraw%60)%3A%20A%20full%20whiteboard%20for%20freeform%20annotation.%0A%20%20%20%20%20%20%20The%20%60scene%60%20traitlet%20gives%20you%20every%20element%20as%20structured%20JSON%2C%20and%20%60get_pil()%60%20returns%0A%20%20%20%20%20%20%20the%20current%20drawing%20as%20a%20PIL%20Image.%0A%0A%20%20%20%203.%20**Reactivity**%3A%20Both%20widgets%20sync%20bi-directionally%20with%20Python%20%E2%80%94%20the%20curve%20editor%20updates%0A%20%20%20%20%20%20%20the%20sampled%20output%20cell%2C%20and%20the%20Excalidraw%20canvas%20is%20always%20available%20for%20programmatic%20access.%0A%0A%20%20%20%20*Built%20with%20%5Bwigglystuff%5D(https%3A%2F%2Fgithub.com%2Fkoaning%2Fwigglystuff)%20%2B%20%5Bmarimo%5D(https%3A%2F%2Fmarimo.io)*%0A%0A%20%20%20%20%23python%20%23curves%20%23splines%20%23excalidraw%20%23opensource%0A%20%20%20%20%22%22%22)%0A%20%20%20%20return%0A%0A%0Aif%20__name__%20%3D%3D%20%22__main__%22%3A%0A%20%20%20%20app.run()%0A