Kresmer - network drawing and diagram editor: the Core component

This is Kresmer's web-component, implementing all its core functionality. If you are looking for the Kresmer desktop application, this is a wrong place. You can find it here.

The Kresmer web-component is used for publishing Kresmer drawings on the web-pages. It is also a core of the Kresmer desktop application, which is built around the single instance of this component.

Getting Started

To use Kresmer component on your web-page do something like this:

1. Install the component

   npm install kresmer

2. Define the place somewhere on the page, where the drawing should be rendered

   ...
   <div id="divDrawing" style="width: 100%; height 100%"></div>
   ...

3. Import the component into your application and mount it on the page

   import Kresmer from 'kresmer';
   const kresmer = new Kresmer("#divDrawing", {logicalWidth: 2000, logicalHeight: 1000, backgroundColor: pink});

   Actually there are much more optional parameters for initializing Kresmer component. You can learn it and much more Kresmer component API details here. And pink is not a usual background color for the network drawings.

4. Load your drawing into the Kresmer

   kresmer.loadDrawing(await (await fetch("my-drawing.kre")).text());

Read Using Kresmer Core Component guide for more details about publishing Kresmer drawings on the web.