/ concept-collection / surfacefun-interactive
Sign in
concept-collection / surfacefun-interactive
Go to fileHistoryFork
.githubAdd claude_args for model configuration
appAdd interactive vector field demo with arrow scale slider
.gitignoreInteractive surfacefun mesh refinement (numbl project)
.numblignoreInteractive surfacefun mesh refinement (numbl project)
CLAUDE.mdAdd interactive vector field demo with arrow scale slider
mesh_refiner.mSplit low-level plumbing into mesh_refiner.m
numbl-project.jsonAdd interactive vector field demo with arrow scale slider
README.mdAdd interactive vector field demo with arrow scale slider
refine_demo.mSplit low-level plumbing into mesh_refiner.m
vector_field_demo.mAdd interactive vector field demo with arrow scale slider
vector_field_viewer.mAdd interactive vector field demo with arrow scale slider

Interactive surfacefun demos#

Runs in your browser through numbl — no install.

Open refine_demo.m and click Run#

A cubed-sphere surfacefun mesh appears in the figure. Drag the Refinement level slider: the page sends the level back to the script, which refines the mesh with surfacefun and returns the new patches — the surface re-renders in place (drag to rotate, scroll to zoom).

Open vector_field_demo.m and click Run#

A tangent vector field (arrows) is displayed on a sphere. Use the Arrow scale slider to make the arrows larger or smaller — scaling updates instantly in the browser with no round-trip to the script. The field is the tangential projection of a constant vector onto the surface, giving a smooth "wind" pattern.

How it works#

  • refine_demo.m — builds a mesh and hands it to mesh_refiner
  • vector_field_demo.m — builds a mesh and vector field; hands them to vector_field_viewer
  • mesh_refiner.m / vector_field_viewer.m — open the figure, send data; mesh_refiner also handles slider callbacks
  • app/ — a small React/three.js app (built to a single HTML file) that renders the surface and hosts the controls

The figure app detects the data type (data.type === 'vectorfield' vs. plain mesh data) and switches between the refinement panel and the arrow-scale panel.

On every push to main, the deploy workflow builds the app, bundles the project with the numbl browser IDE, and publishes it to GitHub Pages.

moveopenescclose