@gram-data/d3-gram

D3 support for gram text format of graph data. (a)-->(b)

Usage no npm install needed!

<script type="module">
  import gramDataD3Gram from 'https://cdn.skypack.dev/@gram-data/d3-gram';
</script>

README

D3 support for the gram text format of graph data. (a)-->(b)<--(c)

How to d3-gram

d3Gram() parses text in the gram format, producing a graph of nodes and links that is ready to be used in a d3-force simulation.

import * as d3 from "d3";
import {parse, layout, draw, drag, updateNodes, updateLinks} from 'd3-gram';

d3.text("https://raw.githubusercontent.com/gram-data/d3-gram/master/public/miserables.gram").then( gramSource => {

  let graph = parse(gramSource);

  let simulation = layout(graph);

  const {nodeSelection, linkSelection} = draw(graph, "svg");

  nodeSelection.call(drag(simulation));

  simulation.on("tick", () => {
    updateNodes(nodeSelection);
    updateLinks(linkSelection);
  });
}