D3 Components

Tree Diagram

<div id="tree-diagram-default"></div>
<div id="tree-diagram-customized"></div>

<script>
  d3.json('../data/frontend-libraries.json', function (data) {
    d3.shuffle(data);
    d3.treeDiagram(data, { id: 'tree-diagram-default' });
  });
  d3.json('../data/frontend-libraries.json', function (data) {
    d3.shuffle(data);
    d3.treeDiagram(data, {
      id: 'tree-diagram-customized',
      hierarchy: {
        root: false,
        collapsed: true,
        successive: true,
        separation: function (a, b) {
          return 1;
        }
      },
      vertices: {
        radius: '0.75%'
      },
      images: {
        show: true
      }
    });
  });
</script>