Skip to content

Visualizations

A handful of components produce visualizations of L4 expressions.

simple ladder SVGs

In 2020, simple Boolean-only decision logic was visualized with a library inspired by ladder logic Boolean circuit diagrams. See the original specification in Google Drive

The tiny versions show up in the sidebar and look like this.

tiny v1 ladder diagram svg

The fuller versions contain text and look like this.

full v1 ladder diagram svg

See also SVGLadder.hs in AnyAll

interactive ladder HTML

Subsequently, interns Jules and Zeming wrote an interactive version in HTML.

This draws the interactive, clickable diagrams at the bottom of the web interview.

npm install jsdoc -g
npm run docs

expression tree explorer

Our redoubtable interns further wrote code to fold (show/hide) subexpressions of MathLang:

https://github.com/smucclaw/usecases/tree/mathlang-vis-horizontal

Video demo

To try it out and click through the graph and fill in the questions:

npm i
npm run watch-ts
npm run start

Petri Net stuff

https://github.com/smucclaw/dsl/blob/main/lib/haskell/natural4/src/LS/XPile/Petri.hs

According to Meng (16 May 2024):

  • Context: This was meant to be a visualization for the state transition parts / deontics-handling parts of L4.
  • Status: Although we still want to offer visualizations for the state transition-y parts in the next iteration of L4, we don't need to stick to Petri Nets. We are free to move to something else, if there are better alternatives.
  • Prior Art: one of the earliest papers in the field of computable contracts, Ronald Lee 1998, chose the Petri Net formalism.