# How to make a Tag Browse Tree in Perspective?

**URL:** <https://forum.inductiveautomation.com/t/how-to-make-a-tag-browse-tree-in-perspective/24997>\
**Category:** Ignition\
**Tags:** perspective\
**Created:** [May 14, 2019, 6:49pm UTC](https://forum.inductiveautomation.com/t/how-to-make-a-tag-browse-tree-in-perspective/24997 "2019-05-14T18:49:27Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![chenlu.han](https://avatars.discourse-cdn.com/v4/letter/c/47e85d/32.png) [@chenlu.han](https://forum.inductiveautomation.com/u/chenlu.han)\
**Post date:** [May 14, 2019, 6:49pm UTC](https://forum.inductiveautomation.com/t/how-to-make-a-tag-browse-tree-in-perspective/24997/1 "2019-05-14T18:49:27Z")

</div>

Hi all,

I am trying to use a tag browse tree in perspective, but I cannot find the corresponding component.

In Vision:  
 ![TagBrowseTree](https://us1.discourse-cdn.com/inductiveautomation/original/2X/4/430557e77083a0ae8a082e2bd1fd3dd4e8bd8989.png)

In Perspective:  
 ![Perspective_Tree](https://us1.discourse-cdn.com/inductiveautomation/original/2X/e/eb76e755703ba6a29c29fd89176e3f596ef17cc8.png)

I could not configure the Perspective Tree to display tags. Does anyone know a script that can populate the props.items array?

Thank you!

---

<div class="post-metadata">

**Author:** ![bmusson](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/bmusson/32/87530_2.png) [@bmusson](https://forum.inductiveautomation.com/u/bmusson)\
**Post date:** [July 10, 2019, 7:59pm UTC](https://forum.inductiveautomation.com/t/how-to-make-a-tag-browse-tree-in-perspective/24997/2 "2019-07-10T19:59:25Z")

</div>

```auto
	# Recursively builds a tag tree, starting from the specified path
	def tagTree(path):
		tagTreeList = []
		newItem = {}
		
		# Browse the curent path.		
		results = system.tag.browse(path)
		
		# Add each tag that was found to a new item.
		for result in results.getResults():
			newItem['label'] = result['name']
			newItem['data'] = result['fullPath']
			
			# If the tag has children, browse and add each of the children to the item.
			if result['hasChildren']:
				newItem['items'] = tagTree(result['fullPath'])
			
			# Once all children have been added to the item, add the new item to the list.
			tagTreeList.append(newItem.copy())
		
		# After all items under the path have been added to the list, return the list.	
		return tagTreeList
```

I couldn’t find this answered anywhere on the forum, here’s what I came up with.

---

<div class="post-metadata">

**Author:** ![mleefers](https://avatars.discourse-cdn.com/v4/letter/m/8edcca/32.png) [@mleefers](https://forum.inductiveautomation.com/u/mleefers)\
**Post date:** [November 19, 2019, 3:02am UTC](https://forum.inductiveautomation.com/t/how-to-make-a-tag-browse-tree-in-perspective/24997/3 "2019-11-19T03:02:08Z")

</div>

This is how I did it too. It can take quite a bit of time to load if you are going to a directory with a few different folders/UDTs.

---

<div class="post-metadata">

**Author:** ![jryan](https://avatars.discourse-cdn.com/v4/letter/j/bbe5ce/32.png) [@jryan](https://forum.inductiveautomation.com/u/jryan)\
**Post date:** [February 27, 2020, 3:15pm UTC](https://forum.inductiveautomation.com/t/how-to-make-a-tag-browse-tree-in-perspective/24997/4 "2020-02-27T15:15:33Z")

</div>

Where are you calling this script from to populate the items property?

---

<div class="post-metadata">

**Author:** ![bmusson](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/bmusson/32/87530_2.png) [@bmusson](https://forum.inductiveautomation.com/u/bmusson)\
**Post date:** [February 27, 2020, 8:11pm UTC](https://forum.inductiveautomation.com/t/how-to-make-a-tag-browse-tree-in-perspective/24997/5 "2020-02-27T20:11:06Z")

</div>

There’s a couple different ways to set this up.

From a script transform:

1. Add a custom property to your Tree component named something like ‘rootPath’.
2. Add a binding to your Tree’s ‘items’ property, binding it to your new custom ‘rootPath’ property followed by a script transform.
3. Call the tagTree() function in this script transform with your ‘rootPath’ property as the input.

On page load:

1. Add ‘onStartup’ script to your view.
2. In this script, call the tagTree() function with your desired path to generate the tagTree list.
3. Then use the script to set your Tree component’s ‘items’ property to the tagTree list.

---

<div class="post-metadata">

**Author:** ![jryan](https://avatars.discourse-cdn.com/v4/letter/j/bbe5ce/32.png) [@jryan](https://forum.inductiveautomation.com/u/jryan)\
**Post date:** [February 28, 2020, 1:29pm UTC](https://forum.inductiveautomation.com/t/how-to-make-a-tag-browse-tree-in-perspective/24997/6 "2020-02-28T13:29:35Z")

</div>

Awesome, i ended up going with the script transform.

Thanks!

---

<div class="post-metadata">

**Author:** ![dan123](https://avatars.discourse-cdn.com/v4/letter/d/cc9497/32.png) [@dan123](https://forum.inductiveautomation.com/u/dan123)\
**Post date:** [March 9, 2020, 7:45pm UTC](https://forum.inductiveautomation.com/t/how-to-make-a-tag-browse-tree-in-perspective/24997/7 "2020-03-09T19:45:13Z")

</div>

First, thanks so much for this Ben, this is exactly what I needed.

One note – `newItem` should be initialized under the `for result in results.getResults():` loop. Otherwise, if the next tag in the list does not have any children, it just inherits the ‘items’ from the previous tag.
