Posted by J.O. Aho on 11/19/05 01:19

HawkEye wrote:
> Hi folks, I think I'm trying to do if not the impossible at least the
> VERY difficult here and would appreciate some advice.
>
> Basically I want to create a dynamic organisation chart. Why ? Cos it
> would look real cool on the Intranet I maintain and get me lots of
> brownie points ;) However I have hit a brick wall. I have my table in
> MySQL with the data in it. I can traverse it using MPTT (Modified
> Preorder Tree Traversal) and get the data out in the 'correct' order so
> it is threaded almost.
>
> What I am really struggling with is the last bit of displaying it like a
> proper Org Chart. No one anywhere seems to do dynamic flow charts in
> php let alone org charts. Is this because it is waay too difficult or
> not possible or am I just not typing the correct search term into Google ??
>
> I can get around it by using a really ugly hack of giving each element a
> div id and then using css. But that means should the data in the db
> change I have to redo almost from scratch the css file. Not the best
> ever dynamic page :)
>
> Any help really appreciated as I'm starting to go bald here trying to
> work it out.

It's not impossible, but requires some thinking and at least at first not
think much about how ugly it may look.


I would start of making a HTML-table where you print the head in the first
row/cell, on the second row I would create new tables with the subs to the
head. Inside each of the tables I would set on the second row the subs to the
subs in their own tables and keep on doing that until you managed to print out
everything you need.


+--------------------------------------------------------+
| HEAD |
+--------------------------------------------------------+
| +-------------------------+ +------------------------+ |
| | Sub 1 | | Sub 2 | |
| +-------------------------+ +------------------------+ |
| | +---------+ +---------+ | | +--------------------+ | |
| | | Sub 1 A | | Sub 1 B | | | | Sub 2 A | | |
| | +---------+ +---------+ | | +--------------------+ | |
| +-------------------------+ +------------------------+ |
+--------------------------------------------------------+

You may need to use some kind of recursive function for this, and this would
work dynamically, a change to the organization and the page would look
different without need of code change.


Sorry no code example, but it will not be that difficult for you, I think.


//Aho

[Back to original message]