@trbn/jsoncanvas

@trbn/jsoncanvas is an implementation of the JSONCanvas Spec in TypeScript.

Note: This package does NOT include a rendering engine. It is only a data structure for a canvas.

Installation

With pnpm:

pnpm install @trbn/jsoncanvas

Example Usage

import { JSONCanvas } from '@trbn/jsoncanvas';

const canvas = new JSONCanvas();

// Adds a text node to the canvas
canvas.addNode({
  id: 'node1',
  type: 'text',
  text: 'Hello, World!',
  x: 100,
  y: 100,
  width: 100,
  height: 100,
});

// Adds another text node to the canvas
canvas.addNode({
  id: 'node2',
  type: 'text',
  text: 'Hello, World 2!',
  x: 200,
  y: 200,
  radius: 50,
});

// Adds an connection between node1 and node2
canvas.addEdge({
  id: 'edge1',
  fromNode: 'node1',
  toNode: 'node2',
  label: 'Edge 1',
});

// Removes node2 and all connections to it
canvas.removeNode('node2');

// Outputs the canvas as a string
console.log(canvas.toString());

License

MIT License © 2024-PRESENT Torben Haack