Isocline

A spec-driven engine for interactive economics graphs. Clean-cut fork of Chris Makler's KineticGraphs, rebuilt around a single typed JSON spec, signal-based reactivity, and a modern build. Intended for teaching managerial economics and game theory.

The repository and npm package currently retain the technical name kgjs-next. The public applet identity is Isocline — Interactive economics; existing KG embeds and kg.js paths remain compatible.

The approved assets live in brand/. See Visual identity for the Clear palette, logo geometry and usage rules.

What is different from the original

• One language. There is a single list of primitive objects (curve, line, point, area, rectangle, arrow, segment, label). No schema: mode to switch into, no second Econ* vocabulary.
• The spec is the contract. A small, versioned, JSON-Schema-validated graph spec is the only thing the runtime consumes. Authoring errors are surfaced, not swallowed to the console.
• Reactivity is a real primitive. Params are signals; one effect rebuilds the scope and redraws through a single update path. No double-recompute, compiled expressions are cached.
• No economics in the runtime. Domain conveniences are optional macros (e.g. LinearDemand) that expand to primitives before the runtime runs. Drop a macro and nothing economics-specific remains.
• Modern toolchain. TypeScript (ES modules, strict), esbuild bundle, D3 v7, mathjs, KaTeX.

Build and run

npm install
npm run build      # -> dist/kg.js (global KG) and dist/kg.esm.js
npm run typecheck

Then open demo/index.html in a browser.

Authoring

A graph is a JSON object: params (adjustable variables), derived (expressions over params), axes or panels, objects, and an optional sidebar. Every numeric field may be an expression string over the flat scope. Interactivity is not a separate concept: a slider is any param with min/max, a drag is a draggable binding on a point. See schema/graph-spec.schema.json for the full contract and samples/ for worked examples.

Macros are optional, transparent sugar

LinearDemand expands to plain line primitives and injects the inverse-demand values (yIntercept, slope, xIntercept) as ordinary derived scope entries. It is opt-in and its output is documented, not a hidden schema. demo/tr_mr_ar.html is authored without it (everything explicit); demo/linear-demand.html shows the same idea with it.

Site and deployment

For the pinned engine used by manec, see Course engine integration. Recovered course examples live in samples/choice-grid.spec.json and samples/auto-eco.spec.json. Run npm test for the runtime regression checks.

npm run site builds a static site into site/: a gallery of every graph, a fully self-contained HTML page per graph (engine + fonts + spec inlined, opens offline with no dependencies), the visual builder, the code editor, and the HTML user manual. Serve site/ on any static host (Forgejo pages, etc.). See docs/deployment.md for the publish steps, and docs/manual/ for the manual sources.

Status

Runtime, spec contract, validation, the macro layer, a full set of managerial-economics and game-theory samples, a Python/SymPy authoring layer that emits the same spec, a visual builder and code editor, and a deployable gallery + manual site. See claude/kgjs-fork-increment-*.md in the project for the build history.

Lineage and license

MIT. Derived from KineticGraphs / kgjs by Chris Makler. The exact upstream copyright notice and full terms are retained in LICENSE and embedded in distributed bundles. See Attribution.