Помогите разобраться с отрисовкой дерева

Chex

Новичок
Помогите разобраться с отрисовкой дерева

Уже второй день бьюсь над этим. Нужно графически представить многомерный массив типа
PHP:
$tree = array(
 0 => array(
   'id'=>1
   'name' => 'Отдел1'
   'children' => array (
      0 => array(
        'id'=>2
        'name' => 'ПодОтдел2'
        'children' => array( ... )
     ),
     1 => array(...),
     ...
 ),
 1 => array( ... ),
 ...
);
У меня появилось несколько идей по этому поводу, отрисовать таблицами, таблицами можно и зависимости отрисовать, что бы понять о чем я предлагаю HTML
<table width="100%" cellpadding="0" cellspacing="0">
<tr>
<td align="center" style="padding-left:3px; padding-right:3px;"><div style="border:1px solid #999999; width:100px; height:20px;">&nbsp;</div></td>
</tr>
</table>

<table width="100%" cellpadding="0" cellspacing="0">

<tr>
<td>
<table width="100%" cellpadding="0" cellspacing="0">
<tr>
<td width="50%">&nbsp;</td>
<td style="border-bottom:1px solid #cccccc;">&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td style="border-left:1px solid #cccccc;">&nbsp;</td>
</tr>
</table>
</td>
<td>
<table width="100%" cellpadding="0" cellspacing="0">
<tr>
<td width="50%" style="border-right:1px solid #cccccc; border-bottom:1px solid #CCCCCC;">&nbsp;</td>
<td style="border-bottom:1px solid #cccccc;">&nbsp;</td>
</tr>
<tr>
<td style="border-right:1px solid #cccccc;">&nbsp;</td>
<td style="">&nbsp;</td>
</tr>
</table>
</td>
<td>
<table width="100%" cellpadding="0" cellspacing="0">
<tr>
<td width="50%">&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td style="border-top:1px solid #CCCCCC; border-right:1px solid #CCCCCC;">&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table>
</td>
</tr>

<tr>
<td align="center" style="padding-left:3px; padding-right:3px;"><div style="border:1px solid #999999; width:100px; height:20px;">&nbsp;</div></td>
<td align="center" style="padding-left:3px; padding-right:3px;"><div style="border:1px solid #999999; width:100px; height:20px;">&nbsp;</div></td>
<td align="center" style="padding-left:3px; padding-right:3px;"><div style="border:1px solid #999999; width:100px; height:20px;">&nbsp;</div></td>
</tr>
</table>

тут появилась масса проблем с отрисовной парентов... Просчитывать каждому блоку конкретные координаты и зависимости отрисовывать дивами??? Если вы сталкивались с подобным, буду очень признателен за помощь.
 

zerkms

TDD infected
Команда форума
в чём у тебя конкретно проблемы? ты не знаешь, что ты хочешь получить в итоге и люди за тебя должны это придумать?
 

FB3

Новичок
<ul><li> если друг в друга вкладывать, то они на каждое вложение сдвигаются вправо...
 

Chex

Новичок
Сори. В итоге нужно получить вот такую структурную схему http://homebie.com/fsys/1/struct.GIF
 
Сверху