Announcing Penrose 3.0

@wodeni

@samestep

We are excited to announce Penrose 3.0! We've added many exciting diagrams to our collection, reworked our core API, and improved support for more complex geometric queries... among many other things!

---

Penrose is a tool for making beautiful diagrams in any area of science, mathematics, or engineering. It's made for those of us who can't (or don't want to!) draw beautiful diagrams by hand.

🎨 New Diagrams

No Penrose release is complete without new beautiful diagrams. Here are some of the new diagrams added to our repo in this release. We also added a new gallery page to our site.

Keenan Crane recently made a tutorial of the walk-on-stars algorithm fully illustrated by Penrose. This is the first LaTeX document made with Penrose, made possible by these new features:

• "SVG (TeX)" export: now you can export a Penrose diagram from the IDE as an SVG with labels optimized for imports using the LaTeX svg package. Keenan made the label font style and size consistent with the rest of his document.
• roger command-line rendering: roger is now a headless renderer for Penrose diagrams!

👩‍💻 A more ergonomic API for @penrose/core

Over the past few months we've simplified our programmatic API to make it easier for you to use Penrose in your own programs. Take a look at our docs for the high-level and low-level parts of our API!

highlevel.js

import { compile, optimize, toSVG, showError } from "@penrose/core";
import trio from "./trio.js";

const compiled = await compile(trio);
// handle compilation errors
if (compiled.isErr()) {
  throw new Error(showError(compiled.error));
}
const converged = optimize(compiled.value);
// handle optimization errors
if (converged.isErr()) {
  throw new Error(showError(converged.error));
}
// render the diagram state as an SVG
const rendered = await toSVG(converged.value, async () => undefined);
const container = document.getElementById("diagram");
container.appendChild(rendered);

lowlevel.js

import { variable, pow, sub, problem } from "@penrose/core";
const x = variable(10);
const problem = await problem({ constraints: [pow(sub(x, 5), 2)] });
const { vals } = problem.start({}).run({});
console.log(problem.converged); // true
console.log(x); // a value closer to 5

📐 Geometry queries and curve support

Many of the new diagrams in our gallery make use of some pretty powerful graphics functions we've been adding to our library. You can find more information for them in our docs, but here are a few fun ones:

• rayIntersect gives the first intersection point with a shape along a ray
• closestSilhouettePoint gives a shape's closest silhouette point to a point
• isEquilateral and isEquiangular constrain polygons to be more regular
• curvatures gives the curvature at each control point along a curve
• inflectionEnergy integrates the derivative of curvature raised to a power

👀 And more!

These only scratch the surface of all we've been working on! Take a look at our changelog to see the full list of changes, or check out some of our recent blog posts for deep dives into topics we didn't cover here:

• Diagram Layout in Stages
• What Have We Done to the Languages?
• Switching to Wasm for 10x Speedup

We'd love to have you diagram with us! Join our Discord and share a diagram you make in Penrose, or if you're feeling more adventurous, check out our CONTRIBUTING.md on GitHub for information about hacking on Penrose itself.

Happy diagramming!