<img align="left" width="80" height="80" src="https://raw.githubusercontent.com/ray-pH/ray-pH.github.io/master/img/diagramatics2.png" alt="Nabla Icon">

# Diagramatics

Diagramatics is a JavaScript/TypeScript library designed to easily create interactive diagrams, especially in math and physics. It provides a high-level API for creating and manipulating diagram elements and interactive controls.

# Examples

Below are some examples of interactive diagrams created using Diagramatics:

![Example Pulley](https://raw.githubusercontent.com/ray-pH/diagramatics/main/assets/example1.png)
![Example Spring](https://raw.githubusercontent.com/ray-pH/diagramatics/main/assets/example2.png)

The interaction are shown in the following GIFs:

![Example Pulley](https://raw.githubusercontent.com/ray-pH/diagramatics/main/assets/example1.gif)
![Example Spring](https://raw.githubusercontent.com/ray-pH/diagramatics/main/assets/example2.gif)

For more examples, visit [Diagramatics Website: Examples](https://photon-ray.xyz/diagramatics-site/examples/).

# Usage & Installation

To try the online editor, please visit [Diagramatics Website: Editor](https://photon-ray.xyz/diagramatics-site/editor/).

To use it in your own project, please refer to [Diagramatics Website: Guides](https://photon-ray.xyz/diagramatics-site/guides/usage/).
