Skip to content

Tree charts

andreaferretti edited this page Feb 16, 2015 · 1 revision

The tree graph can be used as follows:

var Tree = require('paths/tree');
var data = {
  name: 1,
  descendants: [
    {
      name: 2,
      descendants: [
        {
          name: 4,
          descendants: [{
            name: 6,
            descendants: [{ name: 7 }]
          }]
        },
        { name: 5 }
      ]
    },
    {
      name: 3,
      descendants: [{ name: 8 }, { name: 9 }]
    }
  ]
};
var tree = Tree({
  data: data,
  children: function(x) { return x.descendants; },
  compute: {
    color: function(i) { return somePalette[i]; }
  },
  width: 400,
  height: 300
});

Parameters:

  • data: contains a tree-like structure with the data to be plotted.
  • width and height: the dimensions of the graph
  • children (optional): a function that returns the list of children of the given node. Defaults to function(x) { return x.children; }
  • compute (optional): see the introduction.

The return value from Tree is an object with the properties curves and nodes. curves is an array of objects, each one having the properties connector, item and index, where connector contains the actual path object. nodes is an array of objects, each one having the properties point and item, representing the nodes of the tree.

Clone this wiki locally