Planagonia

Modules

Modules

A module extends a plan with new rendering, new interactivity, or a reusable higher-level building block — loaded straight from a URL with module "<url>", the same mechanism for every module below, including the app's own editor tooling (drag-and-drop, syntax highlighting, the Layers panel). Below: every module Planagonia ships — a few have a matching toggle in the app's own header that writes the declaration for you, the rest (including every editor-tooling one) you add to the code pane by hand, already included by default in every shipped example — marked Built-in, plus anything the community has published since.

Anything without the Built-in badge is third-party code — read it before you trust it A community-listed module is someone else's code, not covered by Planagonia's own license. It runs unsandboxed, with the same access to the page any script would have — the app still asks you to confirm before loading one it hasn't seen before, and that's worth taking seriously here too.

Interactivity Built-in

Click-to-select, drag-to-move, connect/disconnect, and the right-click context menu — editing a plan directly in the viewer, not just in the code pane.

Included by default in every shipped example. By hand: module "https://www.planagonia.com/app/interactivity-module.js"

interactivity-module.js

View Built-in

Mouse-wheel and pinch zoom, click-drag pan, the scale bar, and the Fit button — navigating the viewer, separate from editing what's in it.

Included by default in every shipped example. By hand: module "https://www.planagonia.com/app/view-module.js"

view-module.js

Code highlighting Built-in

Syntax coloring and selection highlighting in the code pane.

Included by default in every shipped example. By hand: module "https://www.planagonia.com/app/code-highlight-module.js"

code-highlight-module.js

Layers panel Built-in

The full element tree, expandable, with show/hide and reorder controls.

Included by default in every shipped example. By hand: module "https://www.planagonia.com/app/hierarchy-module.js"

hierarchy-module.js

Grid Built-in

A checkered or line background, a scale reference for the plan — also drives grid-snapped dragging.

The app's own Grid button (View tab) declares and enables it together. By hand: module "https://www.planagonia.com/app/grid-module.js"

grid-module.js

Labels & dimensions Built-in

Renders an element's own label, computed width/height/diameter, and per-edge lengths — plain text or arrow-tipped dimension lines.

The app's own Connections/Dimensions buttons (View tab) declare it automatically; any element using label/dimensions/edgeLengths needs it too. By hand: module "https://www.planagonia.com/app/annotations-module.js"

annotations-module.js

Door Built-in

Real architectural door symbols — a quarter-circle swing arc from the hinge, not a dashed line. compose: "wallWithDoor" still expands one compact element into a matching wall/door/wall structure; a standalone door can also be dropped in on its own from the app's own New Element menu.

Needs an explicit declaration — nothing in the app's own UI writes this one for you: module "https://www.planagonia.com/app/door-module.js"

door-module.js

No community-submitted modules yet — be the first, see "Submitting a module" below.

Submitting a module

Built a module you'd like listed here? Open a pull request against this page on GitHub, adding a card with its name, a one-line description, the module "<url>" line to load it, and a link back to its own source — or email info@planagonia.com and it'll get added by hand.