!@thi.ng/rstream-dot

!npm downloads

> [!NOTE]
> This is one of 214 standalone projects, maintained as part
> of the @thi.ng/umbrella monorepo
> and anti-framework.
>
> 🚀 Please help me to work full-time on these projects by sponsoring me on
> GitHub. Thank you! ❤️

- About
- Status
- Related packages
- Installation
- Dependencies
- Usage examples
- API
- Authors
- License

About

!example graph output

Graphviz DOT conversion of @thi.ng/rstream dataflow graph topologies.

Status

STABLE - used in production

Search or submit any issues for this package

Related packages

- @thi.ng/dgraph-dot - Customizable Graphviz DOT serialization for @thi.ng/dgraph
- @thi.ng/dot - Graphviz document abstraction & serialization to DOT format

Installation

``bash
yarn add @thi.ng/rstream-dot
`

ESM import:

`ts
import * as rsdot from "@thi.ng/rstream-dot";
`

Browser ESM import:

`html

`

JSDelivr documentation

For Node.js REPL:

`js
const rsdot = await import("@thi.ng/rstream-dot");
`

Package sizes (brotli'd, pre-treeshake): ESM: 803 bytes

Dependencies

- @thi.ng/rstream
- @thi.ng/strings
- @thi.ng/transducers

Usage examples

Two projects in this repo's
/examples
directory are using this package:

| Screenshot | Description | Live demo | Source |
|:--------------------------------------------------------------------------------------------------------------------|:-------------------------------------------------------|:-------------------------------------------------------|:------------------------------------------------------------------------------------|
| | Minimal rstream dataflow graph | Demo | Source |
| | Multi-layer vectorization & dithering of bitmap images | Demo | Source |

API

Generated API docs

`ts tangle:export/readme.ts
import { fromIterable, merge, trace } from "@thi.ng/rstream";
import { serialize } from "@thi.ng/rstream-dot";

// create dummy dataflow
const a = fromIterable([1, 2, 3]);
const b = fromIterable([10, 20, 30]);
a.map((x) => x * 10, { id: "x10" });
merge({ src: [a, b] }).subscribe(trace());

// now capture the topology by walking the graph from its root(s)
// and convert the result to GraphViz DOT format
console.log(serialize([a, b]));
`

Resulting output:

`dot tangle:export/readme.dot
digraph g {
rankdir=LR;
node[fontname="sans-serif",fontsize=10,style=filled,fontcolor=white];
edge[fontname="sans-serif",fontsize=10];
s0[label="iterable-0\n(Stream)", color="blue"];
s1[label="x10", color="black"];
s2[label="in-iterable-0", color="black"];
s3[label="streammerge-2\n(StreamMerge)", color="red"];
s4[label="sub-3", color="black"];
s5[label="iterable-1\n(Stream)", color="blue"];
s6[label="in-iterable-1", color="black"];
s3 -> s4;
s2 -> s3;
s0 -> s1[label="xform"];
s0 -> s2;
s6 -> s3;
s5 -> s6;
}
`

Copy output to file graph.dot and then run:

`bash
dot -Tsvg -o graph.svg graph.dot
`

This will generate this diagram:

!graphviz output

Authors

- Karsten Schmidt

If this project contributes to an academic publication, please cite it as:

`bibtex
@misc{thing-rstream-dot,
title = "@thi.ng/rstream-dot",
author = "Karsten Schmidt",
note = "https://thi.ng/rstream-dot",
year = 2018
}
``

License

© 2018 - 2026 Karsten Schmidt // Apache License 2.0