Ext JS plugin for creating organisation chart or tree structure representation

It has been a long time I have been writing another post and this time its on JavaScript, specifically on Ext JS. I have just created one plugin to represent data in tree structure format. I have created a project ExtJSOrgChart on GitHub for this.

This plugin is conversion of jOrgChart plugin created in jQuery by @wesnolte to Ext JS. Also I have tried to extend it in a manner that tree representation can be handled easily through JavaScript operations and these operations can be based on any custom logic. I have seen jOrgChart a while ago and its very good plugin to use for tree structure representation. As I am working on Ext JS right now and hence I have tried to convert the same plugin in Ext JS so that any one using Ext JS doesn’t have any dependency on  jQuery.

ExtJSOrgChart Download
ExtJSOrgChart Plugin

This plugin is a small JavaScript file which inherits most of the features from jOrgChart, also tree structure is prepared out of JavaScript objects directly which provides little bit flexibility in case required. Below are the list of features provided with this plugin:

  1. Very easy to use JavaScript object tree structure.
  2. Objects can be filled up based on required logic, plugin will take care of rendering tree structure.
  3. Object structure allows to fill data from any external source. E.g. Json objects
  4. Nodes can contain any amount of HTML.
  5. Easy to style.
  6. HTML rendered in the nodes can have qtip markup so that easy QuickTip can be provided.

Of course this plugin can be extended to have more features and improvements hence give it a try and provide your comments. Also its published under Dual license under the MIT and GPL so feel free to fork it on GitHub but please maintain copyright information under the plugin JS file.

Author: shaikhmshariq

Software Engineer from India

Leave a comment