@antv/hierarchy

What is @antv/hierarchy?

@antv/hierarchy is a library for visualizing hierarchical data structures. It provides algorithms for layout and rendering of various types of hierarchical diagrams such as trees, clusters, and more.

What are @antv/hierarchy's main functionalities?

Tree Layout

This feature allows you to create a tree layout from hierarchical data. The code sample demonstrates how to use the tree layout algorithm to process a simple hierarchical data structure.

const { hierarchy, tree } = require('@antv/hierarchy');
const data = { name: 'root', children: [{ name: 'child1' }, { name: 'child2' }] };
const root = hierarchy(data);
const layout = tree().size([500, 500]);
const treeData = layout(root);
console.log(treeData);

Cluster Layout

This feature provides a cluster layout for hierarchical data. The code sample shows how to apply the cluster layout algorithm to a hierarchical data structure.

const { hierarchy, cluster } = require('@antv/hierarchy');
const data = { name: 'root', children: [{ name: 'child1' }, { name: 'child2' }] };
const root = hierarchy(data);
const layout = cluster().size([500, 500]);
const clusterData = layout(root);
console.log(clusterData);

Treemap Layout

This feature allows you to create a treemap layout, which is useful for visualizing hierarchical data with weighted nodes. The code sample demonstrates how to generate a treemap layout from a data structure with value attributes.

const { hierarchy, treemap } = require('@antv/hierarchy');
const data = { name: 'root', children: [{ name: 'child1', value: 100 }, { name: 'child2', value: 200 }] };
const root = hierarchy(data).sum(d => d.value);
const layout = treemap().size([500, 500]);
const treemapData = layout(root);
console.log(treemapData);

Other packages similar to @antv/hierarchy

d3-hierarchy

d3-hierarchy is a module of D3.js that provides similar functionality for hierarchical data visualization. It offers a variety of layouts such as tree, cluster, and treemap. Compared to @antv/hierarchy, d3-hierarchy is part of the larger D3 ecosystem, which provides a comprehensive suite of data visualization tools.

flare

Flare is a visualization toolkit for creating interactive visualizations in ActionScript. While not a direct npm package, it offers similar hierarchical visualization capabilities. Flare is more focused on interactive and animated visualizations, whereas @antv/hierarchy is a JavaScript library focused on layout algorithms.

README

hierarchy

layout algorithms for visualizing hierarchical data.

compactBox

dendrogram

indented