Visualizing data with Tree

The Tree component is used to display a hierarchical representation of data in a graphical format. It provides an array of the TreeNode objects as its value. The TreeNode API provides many properties to create tree node objects. The tree structure has basically three major components as listed here:

• The tree elements are called nodes
• The lines connecting elements are called branches
• The nodes without children are called leaf nodes or leaves

A basic example of a Tree component with nodes would be written as follows (the node will represent tourist places):

<p-tree [value]="basicTree"></p-tree>

The data for the Tree component should be provided in a nested parent-child hierarchy. Each tree node is created with a set of properties such as label, data, expandIcon, collapsedIcon, children, and so on. The complete list of the TreeNode properties is shown here:

Name	Type	Default	Description
label	string	null	Label of the node.
data	any	null	Data represented by the node.
icon...