Visualization toolmaker. Founder @observablehq. Creator @d3. Former @nytgraphics. Pronounced BOSS-tock.
Published
Edited
Jan 17, 2022
1 fork
Importers
10 stars
dot`digraph { a -> b }`
dot`graph G {
B [label="Hello World"]
A [label=<Hello<I>World</I>>, color=red]
}`
dot = {
const Viz = await require("viz.js@2");
const viz = await require.resolve("viz.js@2/full.render.js")
.then(url => fetch(url))
.then(response => response.blob())
.then(blob => URL.createObjectURL(blob))
.then(url => new Worker(url))
.then(worker => new Viz({worker}));
const defaults = {files: [], format: "svg", engine: "dot"};
function Dot(options) {
options = Object.assign({}, defaults, options);
return async function dot(strings) {
let string = strings[0] + "", i = 0, n = arguments.length;
while (++i < n) string += arguments[i] + "" + strings[i];
const template = document.createElement("template");
template.innerHTML = await viz.renderString(string, options);
const svg = document.importNode(template.content.firstElementChild, true);
svg.style.maxWidth = "100%";
svg.style.height = "auto";
return svg;
};
}
return Object.assign(Dot(), {options: Dot});
}
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
