Skip to content

Instantly share code, notes, and snippets.

@magjac
Last active February 12, 2024 19:56
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save magjac/e35164b35463f42dc7c273858148bf53 to your computer and use it in GitHub Desktop.
Save magjac/e35164b35463f42dc7c273858148bf53 to your computer and use it in GitHub Desktop.
Render loaded .dot file (!useWorker)
<!DOCTYPE html>
<meta charset="utf-8">
<body>
<script src="https://d3js.org/d3.v5.js"></script>
<script src="https://unpkg.com/viz.js@1.8.1/viz.js" type="application/javascript"></script>
<script src="https://unpkg.com/d3-graphviz@2.1.0/build/d3-graphviz.js"></script>
<div id="graph" style="text-align: center;"></div>
<script>
<!-- This is a (failed) attempt to inhibit stack overflow. -->
Error.stackTraceLimit = Infinity
var graphviz = d3.select("#graph").graphviz(useWorker=false)
<!-- Increase memory available to avoid OOM -->
.totalMemory(Math.pow(2, 27))
.transition(function () {
return d3.transition("main")
.ease(d3.easeLinear);
})
.logEvents(true)
.on("initEnd", readDotAndRender);
function readDotAndRender() {
var filename = "simple.dot"
// var filename = "really_large_not_in_this_gist.dot"
fetch(filename, {mode:'no-cors'})
.then(response => response.text())
.then(text => graphviz.renderDot(text));
}
readDotAndRender();
</script>
</body>
digraph m { a; b; a->b; }
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment