Create tree view in webpages using Google Visulaization Api

Today I am going to tell you about how to create a tree view or binary tree view in webpage using some apis like Google Ajax Api (Visualization Api)

Few days ago I was working with a multi level marketting (MLM) management  software where users are being registered under another refereing user. Thus forming a binary tree. I badly needed to create a tree view in web page. I searched the net for a easy solution. But the searched results were getting meshed up with result like creating folder trees. I didnt too much resources on net about it. Finally I found that its Google providing an ajax api called Google Visualization API that are providing some good tools for visualizing an charts. One of them is organizational chart found in Google Visualization API Gallery.

Visit the organizational documentation to learn how to use this api. It really sounds easy though lakes some customization features. Although I managed it control with use of css and jquery. You dont need to worry about parent child relations you just need tp put a unique id for each node, and provide the id of parent node. This api will do all the rest.

Here is what I generated

google visualization api

Generated Tree

Related posts:

Tags: , , ,

To make money we lose our health, and then to restore our health we lose our money.... We live as if we are never going to die, and we die as if we never lived!

Leave a Reply