Description

{{current_example.desc}}

alchemyConfig.js



var config = {
  dataSource: 'data/team.json',                      

  cluster: true,

  nodeTypes: {"node_type":
                [
                 "family",
                 "coworker", 
                 "classmate", 
                 "friend", 
                 "other"
                ]
               },
  nodeCaption: "firstName",
  rootNodeRadius: 30,

  showControlDash: true,

  showStats: true,
  nodeStats: true,

  showFilters: true,
  nodeFilters: true,

  captionToggle: true,
  edgesToggle: true,
  nodesToggle: true,
  toggleRootNotes: false,

  zoomControls: true
};

alchemy.begin(config);

index.html

<html>
<head>
  <link rel="stylesheet" href="http://cdn.graphalchemist.com/alchemy.min.css"/>
</head>
<body>
  <div class="alchemy" id="graph"></div>

  <script src="http://cdn.graphalchemist.com/alchemy.min.js"></script>
  <script type="text/javascript">
  <div class="alchemy" id="alchemy"></div>
  <script type="text/javascript">
    alchemy.begin(config)
  </script>
</body>
</html>

graphJSON