The EMP mindmap

By accident, I stumbled upon a Java script library for generating mind maps. But instead of having a static diagram, this Java script enabled one is dynamic, you can move nodes, you can zoom in or out to another level of nodes. A very nice graphical way of presenting hierarchical data. For example, who's managing who in Oracle's EMP table as shown below. Come on, grab your mouse and start moving and clicking, it's alive!

Here's the recipe to build such an application.

• Start with downloading the source of the Google code project js-mindmap. In the sources you will several Java script libraries, and an example file js-mindmap.html.

• In APEX upload the Java script libraries add references from the header section to these libraries.

• Add a PL/SQL region, which generates the hierarchy and will be converted in a diagram:

  <canvas id="cv"></canvas>
  <div id="js-mindmap">
    <a>KING</a>
    <ul>
    <li>BLAKE
    <ul>
     <li>ALLEN</li>
     ...
     <li>JAMES</li>
    </ul>
    ...
   </ul>
   </li> 
  </div>

  For example, the function show_emp_tree returns the html code for the <div> element.

Note that when you replace the EMP table by OEHR_EMPLOYEES table the animation will become very slow due to the increase of nodes and links. Also the js-mindmap project is still in development. But anyway it's fun!