https://github.com/stonecypher/jssm-viz

Visualization of JSSM machines using viz.js
https://github.com/stonecypher/jssm-viz

Last synced: about 12 hours ago
JSON representation

Visualization of JSSM machines using viz.js

• Host: GitHub
• URL: https://github.com/stonecypher/jssm-viz
• Owner: StoneCypher
• License: mit
• Created: 2017-06-28T20:45:00.000Z (over 7 years ago)
• Default Branch: main
• Last Pushed: 2024-10-28T09:31:05.000Z (2 months ago)
• Last Synced: 2024-10-30T01:38:51.415Z (2 months ago)
• Language: TypeScript
• Size: 18.3 MB
• Stars: 23
• Watchers: 4
• Forks: 6
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.long.md
  • License: LICENSE.md

Awesome Lists containing this project

README

        
# jssm-viz

Visualization of [JSSM](https://github.com/StoneCypher/jssm/) machines using [viz.js](https://github.com/mdaines/viz.js/)





## TL;DR

Easy to use `fsl` to `svg` through `jssm`.





### Node

```shell

cd ~/projects && mkdir jssm-viz-demo && cd jssm-viz-demo

npm init -y && npm install --save-dev jssm-viz

```

in `dump_svg.js`:

```javascript

async function run() {

  const jssm_viz = require('jssm-viz'),

        fsl_code = 'green => yellow => red => green; [green yellow red] ~> off -> red;';

  svg_code = await jssm_viz.fsl_to_svg_string(fsl_code);

  console.log(svg_code);

}

run();

```

```shell

node ./dump_svg.js

```

Et voila: `svg` of your `fsl`.





### Browser

```html

jssm-viz example

    

    

      window.onload = async () => {

        const ExMachine = `

          Green => Yellow => Red => Green;

          [Red Yellow Green] ~> Off -> Red;

        `;

        document.getElementById('tgt').innerHTML = await window.jssm_viz.fsl_to_svg_string(ExMachine);

      }

    

  

  


```

## What is this?

`jssm-viz` is a way to render your `fsl` and `jssm` to `svg` (and from there to `jpeg` and `png`.)

[See it in use](https://stonecypher.github.io/jssm-viz-demo/graph_explorer.html).

TODO: write a better readme